Useful ES6 Syntax to Know( reduce, bind, every)
Published: 2024-02-13 10:57:49

## 1. reduce
The reduce method applies a function against an accumulator and each element in the array (from left to right) to reduce it to a single value. It's particularly useful for summing up values, concatenating strings, or combining array elements in a single value in various ways.

#### Syntax:

```javascript
array.reduce(function(accumulator, currentValue, currentIndex, array) {
  // Return the updated accumulator
}, initialValue);
```
#### Example: Summing an Array of Numbers

```javascript
const numbers = [1, 2, 3, 4, 5];

// Sum all numbers in the array
const sum = numbers.reduce((accumulator, currentValue) => {
  return accumulator + currentValue;
}, 0); // 0 is the initial value of the accumulator

console.log(sum); // Output: 15
```
#### Example: Creating a Map of Item Frequencies

```javascript
const items = ['apple', 'banana', 'orange', 'banana', 'apple'];

const itemCounts = items.reduce((accumulator, item) => {
  // Initialize the item count as 0 if not already in the accumulator
  accumulator[item] = (accumulator[item] || 0) + 1;
  return accumulator;
}, {}); // Initialize accumulator as an empty object

console.log(itemCounts); // Output: { apple: 2, banana: 2, orange: 1 }
```


## 2. bind
The bind method allows you to permanently set the this context of a function. Regardless of how the function is called, this will refer to the object specified at the time bind was called. This is particularly useful for callback functions or event handlers, where the execution context might not be what you expect.

#### Syntax:

```javascript
const boundFunction = originalFunction.bind(thisArg[, arg1[, arg2[, ...]]]);
```
thisArg: The value to be passed as the this parameter to the target function when the bound function is called.
arg1, arg2, ...: Arguments to prepend to arguments provided to the bound function when invoking the target function.
Example:
```javascript
const person = {
  name: 'John',
  greet: function() {
    console.log(`Hello, ${this.name}`);
  }
};

setTimeout(person.greet, 1000); // Typically, `this` would refer to the global object (window) in this call
setTimeout(person.greet.bind(person), 1000); // Using `bind`, `this` will refer to the `person` object
```
In this example, calling person.greet directly within setTimeout would make this refer to the global object rather than the person object. Using the bind method to explicitly bind this to the person object ensures that this refers to person when setTimeout executes the function.


## 3. every
The every method tests whether all elements in the array pass the test implemented by the provided function. It returns a Boolean value.

#### Syntax:

```javascript
array.every(function(element, index, array) {
  // Return a boolean value
});
```
#### Example: Checking if All Numbers are Positive

```javascript
const numbers = [1, 2, 3, 4, 5];

const allPositive = numbers.every(number => {
  return number > 0;
});

console.log(allPositive); // Output: true
```
#### Example: Verifying Age Eligibility

```javascript
const ages = [22, 18, 19, 23, 17];

const allEligible = ages.every(age => {
  return age >= 18;
});

console.log(allEligible); // Output: false, because one age is below 18
```