转载:http://www.runoob.com/jsref/jsref-reduce.html

 JavaScript Array 对象

实例

计算数组元素相加后的总和:

var numbers = [65, 44, 12, 4];
function getSum(total, num) { return total + num; }
function myFunction(item) { document.getElementById("demo").innerHTML = numbers.reduce(getSum); }

输出结果:

125

定义和用法

reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。

reduce() 可以作为一个高阶函数,用于函数的 compose。

注意: reduce() 对于空数组是不会执行回调函数的。


语法

array.reduce(function(total, currentValue, currentIndex, arr), initialValue)

参数

参数 描述
function(total,currentValue, index,arr) 必需。用于执行每个数组元素的函数。
函数参数:

参数 描述
total 必需。初始值, 或者计算结束后的返回值。
currentValue 必需。当前元素
currentIndex 可选。当前元素的索引
arr 可选。当前元素所属的数组对象。
initialValue 可选。传递给函数的初始值

技术细节

返回值: 返回计算结果
JavaScript 版本: ECMAScript 3

更多实例

实例

四舍五入后计算数组元素的总和:

<button onclick="myFunction()">点我</button> <p>数组元素之和: <span id="demo"></span></p>
<script>
    var numbers = [15.5, 2.3, 1.1, 4.7];
    function getSum(total, num) { return total + Math.round(num); }
    function myFunction(item) {
            document.getElementById("demo").innerHTML = numbers.reduce(getSum, 0);
            }
</script>
 
经验证:如果是数组是对象型数组,如var arr=[{a:1},{a:2},{a:3}],那么reduce的initialValue参数不可省略,一般指定为0

JavaScript reduce() 方法的更多相关文章

  1. JavaScript - reduce方法,reduceRight方法 (Array)

    JavaScript - reduce方法 (Array) 解释:reduce() 方法接收一个函数作为累加器(accumulator),数组 中的每个值(从左到右)开始合并,最终为一个值. 语法:a ...

  2. Javascript reduce方法

    reduce方法接收一个函数作为累加器,数组中的每个值(从左至右)开始缩减,最终计算为一个值 注意:reduce()对于空数组是不会执行回调函数 语法: array.reduce(function(t ...

  3. JavaScript中reduce()方法

    原文  http://aotu.io/notes/2016/04/15/2016-04-14-js-reduce/   JavaScript中reduce()方法不完全指南 reduce() 方法接收 ...

  4. 在JavaScript函数式编程里使用Map和Reduce方法

    所有人都谈论道workflows支持ECMAScript6里出现的令人吃惊的新特性,因此我们很容易忘掉ECMAScript5带给我们一些很棒的工具方法来支持在JavaScript里进行函数编程,这些工 ...

  5. reduce 方法 (Array) (JavaScript)

    对数组中的所有元素调用指定的回调函数.该回调函数的返回值为累积结果,并且此返回值在下一次调用该回调函数时作为参数提供. 语法         array1.reduce(callbackfn[, in ...

  6. JavaScript数组方法reduce解析

    Array.prototype.reduce() 概述 reduce()方法是数组的一个实例方法(共有方法),可以被数组的实例对象调用.reduce() 方法接收一个函数作为累加器(accumulat ...

  7. JavaScript数组的reduce方法详解

    数组经常用到的方法有push.join.indexOf.slice等等,但是有一个经常被我们忽略的方法:reduce,这个方法简直强大的不要不要的. 我们先来看看这个方法的官方概述:reduce()  ...

  8. javascript reduce map函数方法

    retduce: 对数组中的所有元素调用指定的回调函数.该回调函数的返回值为累积结果,并且此返回值在下一次调用该回调函数时作为参数提供. 语法     array1.reduce(callbackfn ...

  9. javascript之reduce()方法的使用

    以前看到reduce方法,总是看得我头皮发麻,今天无意间又遇到他了,于是学习了下,接触之后,觉得这个方法还挺好用的,在很多地方都可以派上用场,比如,数组中元素求和.数组去重.求数组中的最大值或最小值等 ...

随机推荐

  1. POJ-3275:Ranking the Cows(Floyd、bitset)

    Ranking the Cows Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 3301   Accepted: 1511 ...

  2. vi/vim 中批量在行插入或删除指定字符

    1. 在每行的行首行尾插入指定字符      行首::%s/^/insert_word/ 行尾::%s/$/insert_word/  2. 在某些行的行进行替换       在2~50行首添加//号 ...

  3. Hibernate、Spring和Struts工作原理及使用理由

    1.读取并解析配置文件2.读取并解析映射信息,创建SessionFactory3.打开Sesssion4.创建事务Transation5.持久化操作6.提交事务7.关闭Session8.关闭Sesst ...

  4. Java中的变量——通过示例学习Java编程(4)

    作者:CHAITANYA SINGH 来源:https://www.koofun.com/pro/kfpostsdetail?kfpostsid=14&cid= 变量是用来存放可以更改的值的容 ...

  5. 解决部分浏览器不能显示itext生成的PDF文件文本域内容问题

    利用Itext可以实现pdf的高效动态生成,但在实践过程中遇到了一个问题: 即itext利用map中的值设置到pdf模板上建立的文本域中时:能成功生成,但是在部分浏览器上(360,QQ,等浏览器)无法 ...

  6. webpack(2)

    在普通页面中使用render函数渲染组件 render:function(createElements){//createElements是一个方法,调用它,能够把指定的组件模板,渲染成为HTML结构 ...

  7. js图片预加载以及延迟加载

    当我们需要做图片轮播的时候,如果让图片提前下载到本地,用浏览器缓存起来,我们可以用Image对象: function preLoadImg(){ var img=new Image(); img.sr ...

  8. 从零开始利用vue-cli搭建简单音乐网站(三)

    1.利用router-link在组件之间传递数据 如上图,MainPage.vue中主要有8个推荐曲目数据,主要实现方式是建立好主页面模板,然后用v-for循环获取返回的music对象,然后分别绑定曲 ...

  9. 《Head First HTML与CSS》项目实践中学到的东西

    1.组织的重要性. 首先是要建立两个根文件夹,一个存上线页面的资源,一个存测试页面的资源.所有改动内容都在测试页面的文件夹中进行,在这个文件夹中进行测试.W3C语法检测后(HTML检测网站:https ...

  10. JS基础1 — 代码要注意的一些问题

    1.在一对  <script></script>  标签中,有错的js代码,那么该错误代码后面的代码不会执行. 例子:<script> alert("He ...