简介
reduce() 方法对数组中的每个元素执行一个由您提供的reducer函数(升序执行)，将其结果汇总为单个返回值。简单来说有汇总的功能，ES6新增数组函数当中，reduce无疑是最强大的一个函数，掌握好可以在日常工作中节省很多无用功。
reduce函数的参数：
- currentValue (cur) (当前值)
- previousValue(pre) （上一次汇总值，当存在initialValue的时候，第一次执行pre为initialValue，不存在initialValue的时候，第一次执行为数组的第一个元素）===>reduce函数的核心
- initialValue （初始值）
语法
arr.reduce(callback(previousValue, currentValue[, index[, array]])[, initialValue])
基本用法1（求和）
const reducer = (previousValue, currentValue) => previousValue + currentValue;
console.log(array1.reduce((previousValue, currentValue) => previousValue + currentValue));
//由于没有初始值initialValue，所以第一次previousValue为数组第一个元素，后面遍历累加
// 1 + 2 + 3 + 4
// output: 10
// 5 + 1 + 2 + 3 + 4
console.log(array1.reduce((previousValue, currentValue) => previousValue + currentValue)，5);
//由于有初始值initialValue，所以第一次previousValue为初始值5，后面遍历累加
// output: 15
基本用法2（累加对象数组里的值)
要累加对象数组中包含的值，必须提供初始值，以便各个item正确通过你的函数，项目中对多项数据求个和还是比for方便多了
var initialValue = 0;
var sum = [{x: 1}, {x:2}, {x:3}].reduce(function (pre, cur) {
return pre + cur.x;
},initialValue)
console.log(sum) // 6
进阶用法1（二维数组转一维数组）
let flatArr = [[0, 1], [2, 3], [4, 5]].reduce(
function(prev, cur) {
return prev.concat(cur);
},
[]
);
//output:[0,1,2,3,4,5]
进阶用法2（计算数组中每个元素出现的次数）
var names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];
var countedNames = names.reduce(function (prev, cur) {
if (cur in prev) {
prev[cur]++;
}
else {
prev[cur] = 1;
}
return prev;
}, {});
// { 'Alice': 2, 'Bob': 1, 'Tiff': 1, 'Bruce': 1 }
进阶用法3（数组去重）
面试碰到去重使用这种方法，还能给面试官不错的印象
let myArray = ['a', 'b', 'a', 'b', 'c', 'e', 'e', 'c', 'd', 'd', 'd', 'd']
let myOrderedArray = myArray.reduce(function (prev, cur) {
if (prev.indexOf(cur) === -1) {
prev.push(cur)
}
return prev
}, [])
console.log(myOrderedArray)
进阶用法4（字符串表达式在对象中查找值）
用过vue的知道，我们{{a.b.c.d}}能访问到实例身上的嵌套对象层级属性，接下来使用reduce实现一下这个功能
//基本的
let obj = {
a: {
b: {
c: {
d: 12
}
}
}
}
console.log(obj.a.b.c.d)//12显然没毛病
console.log(obj["a.b.c.d"])//undefined 显然是.不能被识别整个字符串北当成了一个整体
//reduce版本
let str = "a.b.c.d"
let arrSplitDotted = str.split(".")
let res = arrSplitDotted.reduce((prev, cur) => {
return prev[cur]
}, obj)
console.log(res)
mdn介绍地址：
developer.mozilla.org/zhCN/docs/W…
好了，这就是reduce几种比较实用的使用方法，有用记得收藏关注哦！！
