JavaScript 数组方法 .reduce()

reduce() 是 JavaScript 中数组方法之一，它将数组中的每个元素依次传递给指定的函数，并将最后一个回调函数的返回值作为最终结果返回。

语法

array.reduce(callback[, initialValue])

• callback 必需，一个回调函数，用于操作数组中的每个元素。
• initialValue 可选，初始值，作为第一次调用 callback 函数时的第一个参数。

回调函数需要接收 4 个参数：

function callback(previousValue, currentValue, currentIndex, array) {
    // 回调函数体
}

• previousValue 必需，上一次调用回调函数时的返回值。
• currentValue 必需，当前元素的值。
• currentIndex 可选，当前元素在数组中的索引。
• array 可选，操作的原始数组。

示例

累计数组元素的总和

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((previousValue, currentValue) => previousValue + currentValue, 0);
console.log(sum) // 输出 15

首先，设置 initialValue 为 0，然后依次遍历 numbers 数组中的元素，将它们累计到 sum 变量中，最后输出结果 15。

数组元素累加器

const numbers = [1, 2, 3, 4, 5];
const accumulator = (previousValue, currentValue) => previousValue + currentValue;
const sum = numbers.reduce(accumulator);
console.log(sum) // 输出 15

这里使用一个变量 accumulator 来保存一个函数，该函数接收两个参数并返回它们的和。然后，使用 reduce() 方法将数组中的所有元素传递给 accumulator 函数，并返回最终结果。

数组扁平化

const arr = [[1, 2], [3, 4], [5, 6]];
const flat = arr.reduce((previousValue, currentValue) => previousValue.concat(currentValue), []);
console.log(flat) // 输出 [1, 2, 3, 4, 5, 6]

这里，reduce() 方法用于将包含多个子数组的二维数组扁平化为一个一维数组。然后，设置 initialValue 为空数组，累计子数组的元素并将它们追加到结果数组中，最后输出扁平化后的数组。

总结

reduce() 方法是 JavaScript 数组方法的重要组成部分之一，它可以用于处理和操作数组中的元素。需要掌握该方法的语法和参数，并了解如何编写回调函数来实现不同的操作，例如对数组元素求和、累加，以及将多个子数组扁平化为一个一维数组等。