Array .reduce()
| Since: | ES5(ECMAScript 2009) |
|---|
A method that processes all elements of an array in order and combines them into a single value. It is useful for a wide range of tasks, such as calculating a sum or converting an array into an object.
Syntax
var result = array.reduce(function(accumulator, currentElement, index, array) {
return nextAccumulator;
}, initialValue);
// Processes elements from right to left.
var result = array.reduceRight(function(accumulator, currentElement, index, array) {
return nextAccumulator;
}, initialValue);
Methods
| Method | Description |
|---|---|
| reduce(function, initialValue) | Processes elements in order from the beginning to the end of the array, combining them into a single value. |
| reduceRight(function, initialValue) | Processes elements in order from the end to the beginning of the array, combining them into a single value. |
Sample Code
var numbers = [1, 2, 3, 4, 5];
// Calculate the sum.
var sum = numbers.reduce(function(total, num) {
return total + num;
}, 0);
console.log(sum); // Outputs: 15
// Find the maximum value.
var max = numbers.reduce(function(biggest, num) {
return num > biggest ? num : biggest;
}, numbers[0]);
console.log(max); // Outputs: 5
// Convert an array into an object.
var members = ["worker_a", "worker_b", "worker_c"];
var obj = members.reduce(function(acc, member, index) {
acc[index] = member;
return acc;
}, {});
console.log(obj); // Outputs: {0: "worker_a", 1: "worker_b", 2: "worker_c"}
// Use reduceRight to concatenate strings from right to left.
var words = ["JavaScript", " ", "Learn"];
var reversed = words.reduceRight(function(str, word) {
return str + word;
}, "");
console.log(reversed); // Outputs: "Learn JavaScript"
15
5
{ '0': 'worker_a', '1': 'worker_b', '2': 'worker_c' }
Learn JavaScript
Overview
With array.reduce(), the first argument of the callback function receives the result of the previous iteration (the accumulator), and the second argument receives the current element. The return value of the function becomes the accumulator for the next iteration, and the return value of the final iteration becomes the overall result of array.reduce().
The initial value (the second argument) is optional, but if omitted, the first element of the array is used as the initial value and the loop starts from the second element. Calling it on an empty array without an initial value will throw an error, so it is recommended to always specify an initial value.
array.reduceRight() works the same way as array.reduce(), except that it processes elements in the opposite direction. Use it when you need to process elements from the end of the array, such as for string concatenation or flattening nested data. For simple sum or average calculations, array.reduce() is the best fit, but if your goal is to transform or filter an array, array.map() or array.filter() will make the intent of your code clearer.
The same result can be achieved with a for loop, but the advantage of reduce is that it lets you express the "combine all elements into a single value" logic concisely.
Browser Compatibility
2 or earlier ×
2 or earlier ×
3.1 or earlier ×
8 or earlier ×
10 or earlier ×
Android Browser
37+ ○
4 or earlier ×
Chrome Android
36+ ○
17 or earlier ×
Firefox Android
79+ ○
3 or earlier ×If you find any errors or copyright issues, please contact us.