点击右上方红色按钮关注“小郑搞码事”,每天都能学到知识,搞懂一个问题,我来为大家讲解一下关于reduce怎么设置?跟着小编一起来看一看吧!
reduce怎么设置
点击右上方红色按钮关注“小郑搞码事”,每天都能学到知识,搞懂一个问题!
大家好!我是/小郑搞码事/的小郑
今天和大家分享一个前端开发中同样非常实用的方法reduce。
关于reduce方法,需要做到两点。
第一,理解它的概念。
将一个数组中的所有元素还原成一个单一的输出值
语法如下:
reduce(cb(返回值,当前值,当前索引,源数组), 初始值)
当前索引和源数组是可以不写的。
cb表示callback。为了不占用太长,我简写了一下。
当前值就是数组中当前正在操作的元素。
返回值就是当前值和初始值操作之后的返回的结果。
第二,知道它有哪些应用。
知道了概念之后,那我们来看一下它的实际使用。
数组元素之和
这个比较好理解
比如数组c=[1,2,3]
c.reduce((a,b) => a b, 0)
输出就是6
上例a就是返回值,b就是当前值。0就是初始值。
数组对象元素之和
这个什么意思呢?就是
c=[{s1:'语文',m1:45},{s1:'数学',m1:50}]
c.reduce((a,b)=> a b.m1, 0)
输出就是95
就这个意思。
过滤重复数据
这个比较好理解
c=[1,3,3,1]
利用reduce将它变成[1,3]。
c.reduce((a,b) => {
if(!a.includes(b)) {
a.push(b)
}
return a;
}, [])
需要注意的是这里的初始值是一个数组[]。
其次就是用到了数组元素存在与否的方法includes判断。都是比较常用的方法。
前端能力越来越强,技术变化日新月异,唯有基础扎实才能完美应对,"前端每日干货"圈子坚持每日为您提供前端最需要掌握的基础知识点。前端知识天天学。
,