reduce用法详解

reduce()累加器，数组中的每个元素依次执行回调函数callback（初始值(或者上次回调函数的返回值)，当前元素值，当前索引，调用reduce的数组）
arr.reduce(callback, [initialValue])

var arr = [1, 2, 3, 4];
var sum = arr.reduce((pre, cur, index, arr) => {
    console.log(pre, cur, index);
    return pre + cur;
})
console.log(arr, sum); // [1, 2, 3, 4] 10   初始值为1,循环3次

var arr = [1, 2, 3, 4];
var sum = arr.reduce((pre, cur, index, arr) => {
    console.log(pre, cur, index);
    return pre + cur;
}, 0)
console.log(arr, sum); // [1, 2, 3, 4] 10   初始值为0,循环4次

求和或求积

var arr = [1, 2, 3, 4];
var sum = arr.reduce((x, y) => {
	return x + y;// 10
}, 0);
var mul = arr.reduce((x, y) => {
	return x * y;// 24
}, 1);

计算数组中每个元素出现的次数

var names = ['Alice', 'Bob', 'Tiff', 'Alice'];
var nameNum = names.reduce((pre, cur) => {
	if (cur in pre) {
		pre[cur]++
	} else {
		pre[cur] = 1
	}
	return pre  
}, {}) // { Alice: 2, Bob: 1, Tiff: 1 }

对象属性求和

var arr = [
	{subject: 'math', score: 10},
	{subject: 'chinese', score: 10},
	{subject: 'english', score: 10}
]
var sum = arr.reduce((pre, cur) => {
	return cur.score + pre
}, 0) // 30

数组去重

var arr = [1, 2, 3, 3, 4, 2]
var newArr = arr.reduce((pre, cur) => {
	if (!pre.includes(cur)) {
		return pre.concat(cur)
	} else {
		return pre
	}
}, [])  // [1, 2, 3, 4]

数组对象去重

var arr = [
	{id: 0, name: "小明"},
    {id: 1, name: "小张"},
    {id: 2, name: "小李"},
    {id: 3, name: "小孙"},
    {id: 1, name: "小周"},
    {id: 2, name: "小陈"}
]
var obj = {}
var newArr = arr.reduce((pre, cur) => {
	obj[cur.id] ? '' : obj[cur.id] = true && pre.push(cur);
	return pre
}, []) // [ {id: 0, name: “小明”}, {id: 1, name: “小张”},{id: 2, name: “小李”},{id: 3, name: “小孙”}]

数组拍平

var arr = [[0, 1], [2, 3], [4, 5]]
var newArr = arr.reduce((pre, cur) => {
	return pre.concat(cur)  // [0,1,2,3,4,5]
}, [])

数组多维拍平

var arr = [[0, 1], [2, 3], [4,[5,6,7]]]
var newArr = function(arr) {
	return arr.reduce((pre, cur) => {
		pre.concat(Array.isArray(cur) ? newArr(cur) : cur)
	}, [])
} // [0, 1, 2, 3, 4, 5, 6, 7]