在JavaScript的ES5版本中Array数组的reduce方法详解

来源：互联网发布：黑客帝国动画版知乎编辑：程序博客网时间：2024/06/01 14:40

函数声明：reduce(callback[, initialValue])

参数说明：

callback - 回调函数，格式为function (prev,next)

initialValue - 初始值，可选参数

返回值：最后一次执行callback 回调函数的返回值

运行机制：

var arr = ['a', 'b', 'c', 'a', 'd'];var i = 0;arr.reduce(function (prev, next) {    i++;    console.log('第' + i + '次循环：', prev, next);    return prev + next;});//VM418:3 第1次循环： a b//VM418:3 第2次循环： ab c//VM418:3 第3次循环： abc a//VM418:3 第4次循环： abca d//"abcad"

采用reduce(callback)调用方式时：

第一次循环，prev=数组的第一个元素，next=数组的第二个元素；

第二次循环，prev=第一次循环的返回值，next=数组的第三个元素；

之后的每一次循环，prev=上一次循环的返回值，next=数组的下一个元素，直到数组末尾。

var arr = ['a', 'b', 'c', 'a', 'd'];var i = 0;arr.reduce(function (prev, next) {    i++;    console.log('第' + i + '次循环：', prev, next);    return prev + next;}, 'n');//VM421:3 第1次循环： n a//VM421:3 第2次循环： na b//VM421:3 第3次循环： nab c//VM421:3 第4次循环： nabc a//VM421:3 第5次循环： nabca d//"nabcad"

采用reduce(callback, initialValue)调用方式时：

第一次循环，prev=initialValue，next=数组的第一个元素。

第二次循环，prev=第一次循环的返回值，next=数组的第二个元素；

之后的每一次循环，prev=上一次循环的返回值，next=数组的下一个元素，直到数组末尾。

是否传递initialValue参数的区别：

采用reduce(callback)方式，在第一次循环时，prev=数组的第一个元素，next=数组的第二个元素；
采用reduce(callback, initialValue)方式，在第一次循环时，prev=initialValue，next=数组的第一个元素。

统计元素个数实例：

var arr = ['a', 'b', 'c', 'a', 'd'];var i = 0;arr.reduce(function (prev, next) {    i++;    console.log('第' + i + '次循环：', prev, next);    prev[next] = (prev[next] + 1) || 1;    return prev;}, {});//VM424:3 第1次循环： Object {} a//VM424:3 第2次循环： Object {a: 1} b//VM424:3 第3次循环： Object {a: 1, b: 1} c//VM424:3 第4次循环： Object {a: 1, b: 1, c: 1} a//VM424:3 第5次循环： Object {a: 2, b: 1, c: 1} d//Object {a: 2, b: 1, c: 1, d: 1}

0 0