How do I reduce an array in JavaScript?

The array.reduce(callback, initialValue) method in JavaScript is used to sequentially process each element of an array while storing the intermediate result. The reduce() method takes as its first argument a callback that is executed to run each element in the array; it applies in turn to each element of the array from left to right while maintaining the intermediate result. The second optional argument is the value that is used as the first argument of the first call to the callback function. If no argument is given, the first element of the array will be used. The reduce() method returns the value of the callback function, which is supplied as an argument the next time the function is called, causing the return value of the final call to evolve the return value of the method (the value is calculated from the elements of the array). In this JavaScript Reduce Array Example, we use the reduce() method to get the sum of the array elements. Click Execute to run the JavaScript Array Reduce Example online and see the result.
How do I reduce an array in JavaScript? Execute
let array = [5, 8, 3, 1, 6];

let reducer = (a, b) => a + b;

console.log(array.reduce(reducer));
Updated: Viewed: 403 times

JavaScript Array reduce() Method

The array.reduce(function(total, currentValue, currentIndex, array), initialValue) method in JavaScript executes the given function on per element of the array and returns the "accumulated" result. This is one of the most complex methods for working with arrays. The Array.reduce() method is more flexible; its purpose is to take an array and compress its contents into a single value. The reduce() method calculates a single value from an array and applies the callback function to each array element in turn, from left to right, while storing the intermediate result.

JavaScript Array reduce() Syntax
array.reduce(function(total, currentValue, currentIndex, array), initialValue)

Where:
  • function: a callback function that will be executed once for each array element in ascending index order. The function takes the following parameters:
    • total: acts as a return accumulator and matches the previously returned value of the callback function. The first time the callback function is called, the sum equals initialValue if one was provided or the first value in the array otherwise
    • currentValue: the value of the current element
    • currentIndex (optional): array index of the current element. It starts at index 0 if initialValue is specified, otherwise at index 1
    • array (optional): the array to which the current element belongs (which is being traversed)
  • initialValue (optional): the value used as the first argument of the first call for the callback function. If no initial value is specified, then the first element of the array will be used.
JavaScript Array Reduce Example
let array = ['One', 'Two', 'Three', 'Four', 'Five'];

let result = (a, b) => a + b;

console.log(array.reduce(result));

// output: OneTwoThreeFourFive

How to reduce an array from right to left?

You can use the reduceRight() method to call the callback in descending index order (right-to-left).

JavaScript Array reduceRight() Example
let array = ['One', 'Two', 'Three', 'Four', 'Five'];

let result = (a, b) => a + b;

console.log(array.reduceRight(result));

// output: FiveFourThreeTwoOne

See also