Array.prototype.reduce()
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since июль 2015 г..
Метод reduce() применяет функцию reducer к каждому элементу массива (слева-направо), возвращая одно результирующее значение.
Интерактивный пример
const array1 = [1, 2, 3, 4];
// 0 + 1 + 2 + 3 + 4
const initialValue = 0;
const sumWithInitial = array1.reduce(
(accumulator, currentValue) => accumulator + currentValue,
initialValue,
);
console.log(sumWithInitial);
// Expected output: 10
Синтаксис
array.reduce(callback[, initialValue])
Параметры
callback-
Функция, выполняющаяся для каждого элемента массива, принимает четыре аргумента:
accumulator-
Аккумулятор, аккумулирующий значение, которое возвращает функция callback после посещения очередного элемента, либо значение
initialValue, если оно предоставлено (смотрите пояснения ниже). currentValue-
Текущий обрабатываемый элемент массива.
indexНеобязательный-
Индекс текущего обрабатываемого элемента массива.
arrayНеобязательный-
Массив, для которого была вызвана функция
reduce.
initialValueНеобязательный-
Необязательный параметр. Объект, используемый в качестве первого аргумента при первом вызове функции
callback.
Описание
Метод reduce() выполняет функцию callback один раз для каждого элемента, присутствующего в массиве, за исключением пустот, принимая четыре аргумента: начальное значение (или значение от предыдущего вызова callback), значение текущего элемента, текущий индекс и массив, по которому происходит итерация.
При первом вызове функции, параметры accumulator и currentValue могут принимать одно из двух значений. Если при вызове reduce() передан аргумент initialValue, то значение accumulator будет равным значению initialValue, а значение currentValue будет равным первому значению в массиве. Если аргумент initialValue не задан, то значение accumulator будет равным первому значению в массиве, а значение currentValue будет равным второму значению в массиве.
Если массив пустой и аргумент initialValue не указан, будет брошено исключение TypeError. Если массив состоит только из одного элемента (независимо от его положения в массиве) и аргумент initialValue не указан, или если аргумент initialValue указан, но массив пустой, то будет возвращено одно это значение, без вызова функции callback.
Предположим, что reduce() используется следующим образом:
[0, 1, 2, 3, 4].reduce(function (previousValue, currentValue, index, array) {
return previousValue + currentValue;
});
Колбэк-функция будет вызвана четыре раза, аргументы и возвращаемое значение при каждом вызове будут следующими:
previousValue |
currentValue |
index |
array |
возвращаемое значение | |
|---|---|---|---|---|---|
| первый вызов | 0 |
1 |
1 |
[0, 1, 2, 3, 4] |
1 |
| второй вызов | 1 |
2 |
2 |
[0, 1, 2, 3, 4] |
3 |
| третий вызов | 3 |
3 |
3 |
[0, 1, 2, 3, 4] |
6 |
| четвёртый вызов | 6 |
4 |
4 |
[0, 1, 2, 3, 4] |
10 |
Значение, возвращённое методом reduce() будет равным последнему результату выполнения колбэк-функции — 10.
Если же вы зададите начальное значение initialValue, результат будет выглядеть так:
[0, 1, 2, 3, 4].reduce(function (accumulator, currentValue, index, array) {
return accumulator + currentValue;
}, 10);
accumulator |
currentValue |
index |
array |
возвращаемое значение | |
|---|---|---|---|---|---|
| первый вызов | 10 |
0 |
0 |
[0, 1, 2, 3, 4] |
10 |
| второй вызов | 10 |
1 |
1 |
[0, 1, 2, 3, 4] |
11 |
| третий вызов | 11 |
2 |
2 |
[0, 1, 2, 3, 4] |
13 |
| четвёртый вызов | 13 |
3 |
3 |
[0, 1, 2, 3, 4] |
16 |
| пятый вызов | 16 |
4 |
4 |
[0, 1, 2, 3, 4] |
20 |
Значение, возвращённое методом reduce() на этот раз, конечно же, будет равным 20.
Примеры
Суммирование всех значений в массиве
var total = [0, 1, 2, 3].reduce(function (a, b) {
return a + b;
});
// total == 6
Суммирование значений в массиве объектов
Чтобы суммировать значения, содержащиеся в массиве объектов, вы должны указать initialValue, чтобы каждый элемент смог пройти через callback.
var initialValue = 0;
var sum = [{ x: 1 }, { x: 2 }, { x: 3 }].reduce(function (
accumulator,
currentValue,
) {
return accumulator + currentValue.x;
}, initialValue);
// sum == 6
Тоже самое, но со стрелочной функцией:
var initialValue = 0;
var sum = [{ x: 1 }, { x: 2 }, { x: 3 }].reduce(
(accumulator, currentValue) => accumulator + currentValue.x,
initialValue,
);
// sum == 6
Разворачивание массива массивов
var flattened = [
[0, 1],
[2, 3],
[4, 5],
].reduce(function (a, b) {
return a.concat(b);
});
// flattened равен [0, 1, 2, 3, 4, 5]
Пример: склеивание массивов, содержащихся в объектах массива, с использованием оператора расширения и initialValue
// friends - список из объектов(друзей)
// где поле "books" - список любимых книг друга
var friends = [
{ name: "Anna", books: ["Bible", "Harry Potter"], age: 21 },
{ name: "Bob", books: ["War and peace", "Romeo and Juliet"], age: 26 },
{ name: "Alice", books: ["The Lord of the Rings", "The Shining"], age: 18 },
];
// allbooks - список, который будет содержать все книги друзей +
// дополнительный список указанный в initialValue
var allbooks = friends.reduce(
function (prev, curr) {
return [...prev, ...curr.books];
},
["Alphabet"],
);
// allbooks = ["Alphabet", "Bible", "Harry Potter", "War and peace",
// "Romeo and Juliet", "The Lord of the Rings", "The Shining"]
Полифил
Метод Array.prototype.reduce() был добавлен к стандарту ECMA-262 в 5-м издании; поэтому он может отсутствовать в других реализациях стандарта. Вы можете работать с ним, добавив следующий код в начало ваших скриптов, он позволяет использовать reduce() в реализациях, которые не поддерживают этот метод.
// Шаги алгоритма ECMA-262, 5-е издание, 15.4.4.21
// Ссылка (en): http://es5.github.io/#x15.4.4.21
// Ссылка (ru): http://es5.javascript.ru/x15.4.html#x15.4.4.21
if (!Array.prototype.reduce) {
Array.prototype.reduce = function (callback /*, initialValue*/) {
"use strict";
if (this == null) {
throw new TypeError("Array.prototype.reduce called on null or undefined");
}
if (typeof callback !== "function") {
throw new TypeError(callback + " is not a function");
}
var t = Object(this),
len = t.length >>> 0,
k = 0,
value;
if (arguments.length >= 2) {
value = arguments[1];
} else {
while (k < len && !(k in t)) {
k++;
}
if (k >= len) {
throw new TypeError("Reduce of empty array with no initial value");
}
value = t[k++];
}
for (; k < len; k++) {
if (k in t) {
value = callback(value, t[k], k, t);
}
}
return value;
};
}
Спецификации
| Specification |
|---|
| ECMAScript® 2026 Language Specification # sec-array.prototype.reduce |
Совместимость с браузерами
Loading…