位置: IT常识 - 正文

在 js 中，reduce() 的详解以及使用方法(js中reduce用法)

编辑：rootadmin

在 js 中，reduce() 的详解以及使用方法 reduce（）：

推荐整理分享在 js 中，reduce() 的详解以及使用方法(js中reduce用法)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:js中reduce用法,js reduce使用场景,jsreduce用法,js中的reduce,js中reduce用法,js reduce使用场景,js中reduce用法,js中reduce用法,内容如对您有帮助，希望把文章链接给更多的朋友！

reduce（）方法为归并类方法，最常用的场景就是，计算数组中的每一项的总和。

reduce（）方法会遍历数组的每一项，他接收两个参数：

第一个参数：每次遍历都会调用的函数，而这个函数有接收四个参数，分别是：前一个值、当前项、项目的索引和数组对象，而这个函数的返回值，回传给下一次遍历时，执行的这个方法的第一个参数。

第二个参数：归并基础的初始值

我们看一下例子： reduce（）怎么用？

let arr = [1,2,3,4,5] arr.reduce((prev,cur)=>{ return prev+cur })

上面的这段代码，是用来计算数组总和的，reduce（）方法中，只传了第一个参数，也就是只传了一个函数，但第二个参数、初始值没有传，当第二个值没有传的时候，第一次循环，prev的值，默认为数组的第一项，而cur的值为数组的第二项，也就是第一次循环，会return 1+2，这个时候，第一次循环返回的结果回传给下一次循环中方法的第一个参数，也就是说、第二次循环方法中prev的值，是第一次循环方法返回的结果

let arr = [1,2,3,4,5]arr.reduce((prev,cur)=>{ return prev+cur},10) 在 js 中，reduce() 的详解以及使用方法(js中reduce用法)

我们传入一下第二个参数，第一个循环，prev的值为reduce的第二个参数，也就是"归并基础的初始值"，而cur的值为数组的第一项，第一项循环会返回10+1

总结：

1.当reduce（）方法的第二个值为空时，第一次循环方法中的第一个参数（prev）为数组的第一项值，第二个参数（cur）为数组的第二项值，反之，第一次循环方法中的第一个参数（prev）为reduce的第二个参数值，第二个参数（cur）为数值的第一项值。

2.reduce（）方法的第一个参数，就是每次遍历都会执行的匿名函数，当前函数的返回值就会传给下一次执行函数的第一个值。也就是prev

reduce 应用场景：

1.数组里所有值的和

var arr = [0,1,2,3]; var value = arr.reduce((pre, cur) => { return pre + cur; }, 0); console.log(value);// 输出：6

2.累加数组中对象的值

var arr = [{ x: 1 }, { x: 2 }, { x: 3 }]; var value = arr.reduce((pre, cur) => { return pre + cur.x; }, 0); console.log(value);// 输出：6

3.将二维数组转为一维数组

var arr = [ [0, 1], [2, 3], [4, 5], ]; var value = arr.reduce((pre, cur) => { return pre.concat(cur); }, []); console.log(value); // 输出：[0, 1, 2, 3, 4, 5]

4.计算数组中每个元素出现的次数

5.按属性对object分类

返回值：

6.数组去重：

var arr = [1, 2, 3, 2, 2, 3, 5, null, null, 0, false, false, true]; var value = arr.reduce((pre, cur) => { return pre.includes(cur) ? pre : pre.concat(cur); }, []); console.log(value);//[1, 2, 3, 5, null, 0, false, true]

本文链接地址:https://www.jiuchutong.com/zhishi/298631.html 转载请保留说明！

上一篇：JavaScript -- Map对象及常用方法介绍(js map())

下一篇：权限管理实现的两种方式（详解）(权限管理实现的功能包括)