2021-08-20 16:09:50
На момент написания этого разбора 68% участников опроса ответили, что .reduce() возвращает любой тип данных. Радует, что это большинство, но процент мог бы быть больше
Я думал, что основным вариантом окажется number, однако он занял только второе место в опросе.
Почему number? Потому что каждый первый пример того, как работает reduce, описан на примере, как получить сумму всех элементов массива.
[1, 2, 3, 4].reduce((acc, item) => acc+= item);
// Результат: 10
Попробуем разобраться.
Метод reduce принимает коллбек, который будет вызываться на каждой итерации при переборе массива.
Первым аргументом этот коллбек принимает так называемый аккумулятор. Его часто пытаются наделить какими-то особенными свойствами, однако это обычная переменная, в которую мы можем что-то записать, и это "что-то" не обнуляется при следующем вызове коллбека, а остаётся. Таким образом, при каждом вызове коллбека мы можем что-то записывать в эту переменную, накапливая значения либо перезаписывая прошлое значение (это уже как мы решим).
Второй, третий и четвертый аргументы коллбека такие же, как и у .map(): сам элемент, на котором вызывается коллбек, его индекс и полностью весь массив.
Помимо коллбека, reduce принимает вторым аргументом значение по умолчанию. Это значение, которое будет записано при инициализации в аккумулятор.
[1, 2, 3, 4].reduce((acc, item) => acc+= item, 0);
Теперь в конце, после коллбека, я передаю значение 0 как стартовое значение для аккумулятора.
Ну вот reduce и возвращает number. В чём подвох?
Массив может состоять из каких угодно элементов, хотя на самом деле это даже не важно, ведь мы можем в аккумулятор накапливать что угодно, не зависимо от того, какой массив мы перебираем.
Что всё-таки вернёт reduce?0. Число
1. Строку
[1, 2, 3, 4].reduce((acc, item) => {
acc += `Слово${item}`;
return acc;
}, '');
// Результат: "Слово1Слово2Слово3Слово4"
2. Массив
[1, 2, 3, 4].reduce((acc, item) => {
acc.push(item * 2);
return acc;
}, []);
// Результат: [2, 4, 6, 8]
3. Объект
[1, 2, 3, 4].reduce((acc, item) => {
acc[`value-${item}`] = item;
return acc;
}, {});
// Результат: {value-1: 1, value-2: 2, value-3: 3, value-4: 4}
4. Undefined
[1, 2, 3, 4].reduce((acc, item) => {
acc = undefined;
return acc;
});
// Результат: undefined
По такому же примеру можно вернуть любой тип данных. Хоть он и достаточно синтетический, но он отлично отражает то, что reduce вернёт что угодно. Любое значение, которое будет записано в аккумулятор.
А вообще с помощью reduce можно решать много интересных задачек. Какие вам приходилось решать? Делитесь в комментариях
749 viewsedited 13:09
F
