栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > 后端开发 > Java

JS数组的reduce的妙用

Java 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

JS数组的reduce的妙用

JS数组的reduce的妙用
reduce是减少; 缩小的意思。
更合适的编程术语翻译应该是:归一,归并。意思是将数组中的数据,通过某种计算得到一个归并的结果。
比如:将一个数组中所有的值累加,得到它们的和。


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

运行一个reduce函数,需要准备的数据是:

  1. 需要处理的数组(如,准备求和的数组)
let arr = [1, 2, 3, 4, 5, 6]
  1. 初始的结果(如,数字0)
let result = 0
  1. 一个计算函数,可以将上次计算得到的结果,和当前元素计算得到新结果的函数。
如 :
(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 ] }
转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/282731.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号