JS数组方法reduce的用法实例分析


Posted in Javascript onMarch 03, 2020

本文实例讲述了JS数组方法reduce的用法。分享给大家供大家参考,具体如下:

数组方法 reduce 用来迭代一个数组,并且把它累积到一个值中。

使用 reduce 方法时,你要传入一个回调函数,这个回调函数的参数是一个 累加器 (比如例子中的 previousVal) 和当前值 (currentVal)。

reduce 方法有一个可选的第二参数,它可以被用来设置累加器的初始值。如果没有在这定义初始值,那么初始值将变成数组中的第一项,而 currentVal 将从数组的第二项开始。

使用 reduce 方法来让 array 中的所有值相加

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>reduce的使用</title>
</head>
<body>
<script>
var arr = [1, 2, 3, 4, 5];
sum = arr.reduce(function(prev, cur, index, arr) {
   //输出的是第一项的值或上一次叠加的结果,正在被处理的元素,正在被处理的元素的索引值
   console.log(prev, cur, index); 
   return prev + cur;
})
console.log(arr, sum); //输入数组本身和最后的结果
</script>
</body>
</html>

控制台输出:

JS数组方法reduce的用法实例分析 

var numbers = [15.5, 2.3, 1.1, 4.7];
 
function getSum(total, num) {
  return total + Math.round(num);
}
function myFunction(item) {
  console.log(numbers.reduce(getSum, 0));//0 传递给函数的初始值
}
myFunction()//输出24

JS数组方法reduce的用法实例分析

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
asp.net HttpHandler实现图片防盗链
Nov 09 Javascript
JavaScript为对象原型prototype添加属性的两种方式
Aug 01 Javascript
xss文件页面内容读取(解决)
Nov 28 Javascript
Extjs grid添加一个图片状态或者按钮的方法
Apr 03 Javascript
使用jquery.upload.js实现异步上传示例代码
Jul 29 Javascript
jquery.mobile 共同布局遇到的问题小结
Feb 10 Javascript
浅谈Javascript数组索引
Jul 29 Javascript
深入理解JS实现快速排序和去重
Oct 17 Javascript
浅谈vue的iview列表table render函数设置DOM属性值的方法
Sep 30 Javascript
ES6 中可以提升幸福度的小功能
Aug 06 Javascript
AngularJS 事件发布机制
Aug 28 Javascript
js实现飞机大战游戏
Aug 26 Javascript
Javascript模拟实现new原理解析
Mar 03 #Javascript
JS面向对象编程——ES6 中class的继承用法详解
Mar 03 #Javascript
JS面向对象编程实现的拖拽功能案例详解
Mar 03 #Javascript
序列化模块json代码实例详解
Mar 03 #Javascript
JS常用排序方法实例代码解析
Mar 03 #Javascript
JS面向对象编程实现的Tab选项卡案例详解
Mar 03 #Javascript
JS面向对象编程基础篇(三) 继承操作实例详解
Mar 03 #Javascript
You might like
mysql limit查询优化分析
2008/11/12 PHP
Prototype源码浅析 String部分(四)之补充
2012/01/16 Javascript
表单类各种类型(文本框)失去焦点效果jquery代码
2013/04/26 Javascript
jQuery设置div一直在页面顶部显示的方法
2013/10/24 Javascript
jQuery打印图片pdf、txt示例代码
2014/07/22 Javascript
详解js中构造流程图的核心技术JsPlumb(2)
2015/12/08 Javascript
AngularJS 输入验证详解及实例代码
2016/07/28 Javascript
利用原生js和jQuery实现单选框的勾选和取消操作的方法
2016/09/04 Javascript
AngularJS指令用法详解
2016/11/02 Javascript
原生JavaScript实现的简单省市县三级联动功能示例
2017/05/27 Javascript
Vue实现active点击切换方法
2018/03/16 Javascript
微信小程序实现上传图片功能
2018/05/28 Javascript
在vue中解决提示警告 for循环报错的方法
2018/09/28 Javascript
JS实现图片切换效果
2018/11/17 Javascript
微信小程序调用wx.getImageInfo遇到的坑解决
2020/05/31 Javascript
[01:09:40]Newbee vs Pain 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
[59:35]DOTA2-DPC中国联赛定级赛 Aster vs DLG BO3第一场 1月8日
2021/03/11 DOTA
python基础教程之循环介绍
2014/08/29 Python
Python获取当前路径实现代码
2017/05/08 Python
Python面向对象之继承和组合用法实例分析
2018/08/27 Python
Python随机生成身份证号码及校验功能
2018/12/04 Python
10行Python代码计算汽车数量的实现方法
2019/10/23 Python
Python imutils 填充图片周边为黑色的实现
2020/01/19 Python
Python super()方法原理详解
2020/03/31 Python
Python + opencv对拍照得到的图片进行背景去除的实现方法
2020/11/18 Python
全球异乡人的跨境社交电商平台:Kouhigh口嗨网
2020/07/24 全球购物
Sony C++笔试题
2013/03/10 面试题
假日旅行社实习自我鉴定
2013/09/24 职场文书
致200米运动员广播稿
2014/02/06 职场文书
学校对教师的评语
2014/04/28 职场文书
考察邀请函范文
2015/01/31 职场文书
爱牙日宣传活动总结
2015/02/05 职场文书
会计主管岗位职责
2015/04/02 职场文书
2015人事行政工作总结范文
2015/05/21 职场文书
2019自荐信范文集锦!
2019/07/03 职场文书
浅析MongoDB之安全认证
2021/06/26 MongoDB