What is the array reduce() method in JavaScript?

JavaScript array reduce() method is different from other iteration methods; in fact, the reduce() method reduces an array to a single value.

The reduce() method does not modify the existing array and returns one and only one value. It is used to find the sum of array elements, determine the maximum and minimum value in an array, and flatten the array.

Prior to the reduce() method, for loop is used to perform the tasks, which are now performed by the reduce() method. Suppose you want to calculate the sum of all the elements of an array; then, with the help of a for loop, you loop through all the elements and add them to get the total sum.

let numbers = [10, 11, 12, 13, 14];
let total = 0;
for(let i=0; i<numbers.length; i++){
  total += numbers[i];
}
console.log(`The sum of array elements: ${total}`);

Output

The sum of array elements: 60

How to use the array reduce() method in JavaScript?

Before you start using the reduce() method, you must understand the two terms introduced by the reduce() method, reducer and accumulator. The reduce() method accepts two arguments, the callback function and the initial value.

const value = array.reduce(callback, initialValue);

The callback function is called a reducer. It has the following form:

function reducer(accumulator, currentValue, currentIndex, array){
  //return a value
}

It is recommended that you use the arrow function as the callback function.

const reducer = (accumulator, currentValue, currentIndex, array)=>{
  //return a value
}

The accumulator is the value returned by the reduce() method when the reduce() function has finished processing the array.

The reducer function is called for each element of the array, and the current processing element is passed to it. It is compulsory to return a value in each execution. The returned value is assigned to the accumulator. In the final execution of the callback function, the accumulator's value is returned by the reduce() method.

The initialValue argument is optional. Suppose you pass a value to the initialValue argument. In that case, the reduce() method will assign that value to the accumulator during the first call of the reducer function. On the other hand, if you don't pass the initialValue argument, the reduce() method will assign the value of the first element of the array to the accumulator.

Let's find the sum of array elements using the reduce() method.

let numbers = [10, 11, 12, 13, 14];
let total = numbers.reduce((acc, curr)=>{
  return acc + curr;
}, 0);
console.log(`The sum of array elements: ${total}`);

When 0 is passed to the initialValue argument. The reduce() method will execute in the following way:

let numbers = [10, 11, 12, 13, 14];
let total = numbers.reduce((acc, curr)=>{
  return acc + curr;
});
console.log(`The sum of array elements: ${total}`);

When nothing is passed to the initialValue argument. The reduce() method will execute in the following way:

How to find the maximum value in an array using the reduce() method?

With the help of reduce() method, let's find the maximum value in an array.

let numbers = [4, -4, 10, 203, 53, 11];
let maximumValue = numbers.reduce((acc, curr)=>{
  if(acc>=curr){
    return acc;
  }else{
    return curr;
  }
}, 0);
console.log(`The maximum value in an array: ${maximumValue}`);

Output

The maximum value in an array: 203

How to find the minimum value in an array using the reduce() method?

With the help of reduce() method, let's find the minimum value in an array.

let numbers = [4, -4, 10, 203, 53, 11];
let minimumValue = numbers.reduce((acc, curr)=>{
  if(acc<=curr){
    return acc;
  }else{
    return curr;
  }
}, 0);
console.log(`The minimum value in an array: ${minimumValue}`);

Output

The minimum value in an array: -4

Recommended Posts

• How to use forEach() method to loop through JavaScript Array?
• How to use the JavaScript Array map() method?
• How to use the Array filter() method in JavaScript?
• How to reduce an array of objects in JavaScript?
• JavaScript Array Exercises, Practice and Solution