.reduce()的简单例子

求[1,2,3].reduce((a,b) => console.log(a,b))的输出结果?

写这篇文章的原因是看到 ↑ 这道题目, 打印结果是

4 5
undefined 1
undefined

当时就很疑惑怎么会打印出undefined这个奇怪的结果出来
我们先来看看reduce的定义:

定义和用法
reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。
reduce() 可以作为一个高阶函数，用于函数的 compose。
注意: reduce() 对于空数组是不会执行回调函数的。

语法
array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

参数	描述
total	必需。初始值, 或者计算结束后的返回值。
currentValue	必需。当前元素
currentIndex	可选。当前元素的索引
arr	可选。当前元素所属的数组对象。
initialValue	可选。传递给函数的初始值

------------------------------以上是reduce的介绍------------------------------

可以看看以下几个例子

代码块一:

[4,5,1].reduce((a,b) => console.log(a,b);)
console result ==>
4 5
undefined 1
undefined

代码块二:

[4,5,1].reduce((a,b) => {console.log(a,b);return a+b;})
console result ==>
4 5
9 1
10

代码块三:

=======> 1:
[4,5,1].reduce((a,b) => {console.log(a,b);return a+b;},0)
console result ==>
0 4
4 5
9 1

=======> 2:
[4,5,1].reduce((a,b) => {console.log(a,b);return a+b;},5)
console result ==>
5 4
9 5
14 1

可以看出, 打印出undefined的代码块一中, 没有return, 而reduce语法中, 如果要相加, 是需要设定返回值的–>total | 必需。初始值, 或者计算结束后的返回值 。由于此代码块中没有进行return操作, 才会有undefined这种值的出现

而代码块二和代码块三-1的区别是, 三添加了initialValue参数, 这个参数的作用是设置传递给函数的初始值 , 当不设定的时候, initialValue会从index为1的下标数值开始(如代码块二)

而代码块三-1和代码块三-2中也可以看出区别, initialValue设置为0时, 对于数据的结果是没有影响的, 而设置为5时, 即设置5为初始值进行相加操作

当然, 除了相加等简单数学操作, reduce还有更多高级的使用方式, 例如数组去重, 数组合并等等, 以下为其他博主的传送门:
reduce的其他高级操作