简单使用reduce进行数组过滤

使用reduce进行数组过滤

定义和用法

reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。

reduce() 可以作为一个高阶函数，用于函数的 compose。

注意: reduce() 对于空数组是不会执行回调函数的。

---

参数描述

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

---

示例1

let arr = [1, 2, 3, 4];
arr = arr.reduce((result, current) => {
	return result += current;
});
console.log(arr);// 10

上述代码给数组对象reduce方法传入一个回调函数，在回调函数里返回每次的累加值。

result是我们最后要返回的结果，current是遍历数组时的每一个数组元素，这里我们未定义initialValue，js弱类型便会自动默认result的类型，数字类型默认值为0，所以result+=current相当于0 += 1, 1 += 2, ...最终返回了10。

改动上面代码：

let arr = [1, 2, 3, 4];
arr = arr.reduce((result, current) => {
	return result += current;
}, []);
console.log(arr);// 1234

指定了初始化值为一个空数组，return result += current ---> result = [] + 1;// '1'（这里的result代表下一次遍历的第一个参数result），result类型变为了字符串，所以最终累加结果等于1234。

示例2

了解了reduce方法的流程，开始写一个简单的数组去重。

let arr = [
	{ code: 1, name: '张三' },
	{ code: 2, name: '李四' },
	{ code: 1, name: '张三' },
	{ code: 3, name: '赵六' },
	{ code: 2, name: '李四' }
];
let obj = {};
arr = arr.reduce((result, current) => {
	if (!obj[`_${ current.code }`]) { // 加上下划线区分，key：_1
		
		obj[`_${ current.code }`] = true;// 将这个key添加入obj中
		result.push(current);// 这里的result就是我们传进的空数组
	}
	return result;
}, []);
console.log(arr);// [{…}, {…}, {…}]

上述代码可自行测试，加深印象。

---

end