JS数组的reduce的妙用

其中的①执行一次，②③④会根据数组元素循环执行。

运行一个reduce函数，需要准备的数据是：

1. 需要处理的数组（如，准备求和的数组）

let arr = [1, 2, 3, 4, 5, 6]

2. 初始的结果（如，数字0）

let result = 0

3. 一个计算函数，可以将上次计算得到的结果，和当前元素计算得到新结果的函数。

如 ：
(lastResult, item) => {
	return lastResult + item;
}

reduce函数首先会将0赋值给初始结果。
然后挨个取出元素，去与计算结果参与计算（lastResult + item），再将新的结果返回。
当所有元素计算完毕时，reduce返回最后一次的结算结果。

let arr = [1, 2, 3, 4, 5, 6]
let result = arr.reduce((lastResult, item) => {
	return lastResult + item;
}, 0);

console.log('result: ', result)

由于reduce函数会对数组进行循环操作，所以reduce函数可以对js数组的其他循环操作进行替换，如：forEach, filter, map 。
比如找到数组中最大的值：

let arr = [1, 2, 3, 4, 5, 6]
let result = arr.reduce((lastResult, item) => {
	if (item > lastResult) {
		return item;
	}
	return lastResult;
}, 0);

console.log('result: ', result)

比如过滤掉数组中小于3的元素，得到一个新的数组，类似filter。

let arr = [1, 2, 3, 4, 5, 6]
let result = arr.reduce((lastResult, item) => {
	if (item > 3) {
		lastResult.push(item);
	}
	return lastResult;
}, []);

console.log('result: ', result)

比如将数组中的所有元素+1得到新的数组，得到一个新的数组，类似map。

let arr = [1, 2, 3, 4, 5, 6]
let result = arr.reduce((lastResult, item) => {
	lastResult.push(item + 1);
	return lastResult;
}, []);

console.log('result: ', result)

reduce的方便之处在于，它可以将数组转化为任何你想要的数据，这一点是其他的数组操作函数不具备的。
我们来一个复杂一点的例子，对数组进行分组操作。

let arr = [1, 2, 3, 4, 5, 6]
let result = arr.reduce((lastResult, item) => {
	if (item % 2 == 0) {
		lastResult.even.push(item);
	} else {
		lastResult.odd.push(item);
	}
	return lastResult;
}, {
	odd: [],
	even: [],
});
console.log('result: ', result)

输出结果：

result:  { odd: [ 1, 3, 5 ], even: [ 2, 4, 6 ] }