reduce怎么设置（前端工程师应该如何理解和记住reduce方法的概念及应用）

点击右上方红色按钮关注“小郑搞码事”，每天都能学到知识，搞懂一个问题，我来为大家讲解一下关于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判断。都是比较常用的方法。

前端能力越来越强，技术变化日新月异，唯有基础扎实才能完美应对，"前端每日干货"圈子坚持每日为您提供前端最需要掌握的基础知识点。前端知识天天学。

,