1.reduce方法介绍：
reduce语法：arr.reduce(callback,[initialValue])
callback函数可接受四个参数：
callback （执行数组中每个值的函数，包含四个参数）
1、previousValue （上一次调用回调返回的值，或者是提供的初始值（initialValue））
2、currentValue （数组中当前被处理的元素）
3、index （当前元素在数组中的索引）
4、array （调用 reduce 的数组）
initialValue （作为第一次调用 callback 的第一个参数。）
记得callback内部的结果一定要return 出去，结果才能被接收
例子:
1、数组求和（一）
let arr = [1, 2, 3, 4];
let sum = arr.reduce((pre,cur,index,arr)=>{
return pre + cur;
});
打印一下每次的pre、cur、index来看下计算的过程
| pre | cur | pre+cur | index |
|---|---|---|---|
| 1 | 2 | 1+2 = 3 | 1 |
| 3 | 3 | 3+3 = 6 | 2 |
| 6 | 4 | 6+4 = 10 | 3 |
- 可看出每次的pre是上次调用函数的返回值，即上次计算的和，作为下次调用的第一个参数值。
- reduce方法没有设置可选参数
initialValue，所以index从1开始。第一次的pre的值也是数组的第一个值。 - 可看出求和本应遍历4次，但是却遍历了三次，由此可能是遍历复杂度稍微减少一点。
2、数组求和（二）
let arr = [1, 2, 3, 4];
let sum = arr.reduce((pre,cur,index,arr)=>{
return pre + cur;
},0);
设置了initialValue，第一次回调的初始值，相当于给pre赋初值，再来看打印的状况
| pre | cur | pre+cur | index |
|---|---|---|---|
| 0 | 1 | 0+1 = 1 | 0 |
| 1 | 2 | 1+2 = 3 | 1 |
| 3 | 3 | 3+3 = 6 | 2 |
| 6 | 4 | 6+4 = 10 | 3 |
- 同样的，上次的函数结果是下次计算的pre值，但是不同的是，因为设置了第一次回调函数的值为0，所以index也从0开始，总共遍历4次。
由此可见，initialValue的设置，会改变执行的index开始值，以及每次的pre值，但是执行的结果不变。
3.数组去重
let arr = [1,3,4,2,6,3,7];
let resArr = arr.reduce((pre,cur)=>{
console.log(pre);
if(!pre.includes(cur)){
return pre.concat(cur); concat方法，会返回一个新的副本数组
}
else{
return pre;
}
},[])
console.log(resArr);//[1,3,4,2,6,7]
4.统计数组元素出现次数
let objArr = ['one','two','three','four','one','four'];
let resObj = objArr.reduce((pre,cur)=>{
if(cur in pre){ //已存在
pre[cur]++;
}
else{ //不存在
pre[cur] = 1;
}
console.log(pre);
return pre;
},{})
console.log(resObj); //{one: 2, two: 1, three: 1, four: 2}
- 打印pre 看其执行过程：
{one: 1}
{one: 1, two: 1}
{one: 1, two: 1, three: 1}
{one: 1, two: 1, three: 1, four: 1}
{one: 2, two: 1, three: 1, four: 1}
{one: 2, two: 1, three: 1, four: 2}
5.二维数组转换成一维
let arr = [1,[2,3],4,5,[7,8]];
let resArr = arr.reduce((pre,cur) =>{
console.log(pre);
return pre.concat(cur);
},[])
console.log(resArr); //[1, 2, 3, 4, 5, 7, 8]
- 打印pre看其执行过程：(其实很简单)
[]
[1]
[1, 2, 3]
[1, 2, 3, 4]
[1, 2, 3, 4, 5]
[1, 2, 3, 4, 5, 7, 8]
总结：上面这些例子，都是规定了pre的初始值，利用了pre 是前一次回调函数的返回值的特性，去进行操作。
上面这些，就算比较常接触的数组一些操作，用reduce也是非常的方便了。
看到有篇博客，讲的很不错，就学习总结一下//www.greatytc.com/p/e375ba1cfc47
虽然是假期，但是还是要学习，基础很重要！
