reduce() 方法是ES5中新增的一个数组逐项处理方法, 对数组中的每个元素执行一个特定方法,并将其结果汇总为单个返回值。
Array.prototye.reduce ES5.1规范

语法

arr.reduce.png

arr.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])

参数

  • callback : 执行数组中每个值的函数,它同时包含四个参数;

    • accumulator(累计器): 累计回调的返回值,它是上次调用回调时返回的累积值,或 initialValue。
    • currentValue: 正在处理的数组中的当前元素的值。
    • index :可选,正在处理的数组中的当前元素的索引。
    • array :可选,调用 reduce() 的数组。
  • initialValue: 可选,作为第一次调用 callback 函数时的第一个参数的值。若没提供初始值,则将使用数组的第一个元素。若在没有初始值的空数组上调用 reduce 将报错。

返回值:函数累计处理的结果。

reduce() 为数组中的每个元素依次执行 callback 函数(数组中被删除或没赋值的元素除外).
回调函数第一次执行时, accumulator 和 currentValue 的取值有两种情况:

  1. 若调用 reduce() 时提供了 initialValue,则 accumulator 取值为 initialValue, currentValue 取数组中的第一个值;
  2. 若调用 reduce() 时没有提供 initialValue,则 accumulator 取数组中的第一个值, currentValue 取数组中的第二个值。

reduce() 如何运行

假如运行如下代码:

[0, 1, 2, 3, 4].reduce(function(accumulator, currentValue, currentIndex, array){
  return accumulator + currentValue;
});

callback 被调用四次,每次调用的参数和返回值如下表:

01.png
使用箭头函数:

[0, 1, 2, 3, 4].reduce((prev, curr) => prev + curr );

reduce() 的第二个参数提供 10 为初始值:

[0, 1, 2, 3, 4].reduce((accumulator, currentValue, currentIndex, array) => {
    return accumulator + currentValue
}, 10)

02.png


Carlos
24 声望1 粉丝

Full Stack Developer & Maker