作为一个前端菜鸟,觉得资料比较好,特地分享一下~~

reduce() 方法接收一个函数作为累加器(accumulator),数组中的每个值(从左到右)开始缩减,最终为一个值。
你一定也和我一样看的有点迷糊,其实reduce接收的就是一个回调函数,去调用数组里的每一项,直到数组结束。
reduce接受一个函数,函数有四个参数,分别是:
     1、上一次的值;
     2、当前值;
     3、当前值的索引;
     4、数组;

var array = [4,5,6,7];
var singleVal = 0;

// 只能在这一行下面写代码
var singleVal = array.reduce(function(previousVal,currentVal){
return previousVal + currentVal;
},0);

这个是求总和的,所有数组的值的和,

分析一下这个结果,这个回调函数共调用了4次,因为第一次没有previousValue,所以直接从数组的第二项开始,一只调用到数组结束。
reduce还有第二个参数,我们可以把这个参数作为第一次调用callback时的第一个参数,上面这个例子因为没有第二个参数,所以直接从数组的第二项开始,如果我们给了第二个参数为5,那么结果就是这样的:
结果应该是 数组的和是 5 + 4 +5 + 6+7 = 27 
第一次调用的previousValue的值就用传入的第二个参数代替,函数被调用了5次,也就是数组的length。
reduce可以帮助我们轻松的完成很多事,除了累加,还有扁平化一个二维数组:
 
没有图啊,嫌麻烦 

关于javascript 的reduce方法的更多相关文章

  1. JavaScript中reduce()方法

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

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

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

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

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

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

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

  5. reduce 方法 (Array) (JavaScript)

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

  6. JavaScript数组归并方法reduce

    示例代码: <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF ...

  7. JavaScript reduce() 方法

    转载:http://www.runoob.com/jsref/jsref-reduce.html  JavaScript Array 对象 实例 计算数组元素相加后的总和: var numbers = ...

  8. JavaScript数组的reduce方法详解

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

  9. Javascript reduce方法

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

随机推荐

  1. 扩展 ajaxupload.js ,支持客户端判断上传文件的大小

    onSubmit: function(file, extension){}, 修改为 onSubmit: function(file, extension, size){}, if (! (setti ...

  2. CentOS-Samba服务安装与配置

    title date tags layout CentOS6.5 Samba服务安装与配置 2018-09-03 Centos6.5服务器搭建 post 例题: 在服务器中安装Samba服务,创建共享 ...

  3. Qt QImage的浅拷贝与深拷贝

    首先简单说说什么是浅拷贝和深拷贝:浅拷贝就比如像引用类型,而深拷贝就比如值类型,即浅拷贝是共用一块内存的,而深拷贝是复制一份内容. 我们再来看看QImage类的几个构造函数: // 浅拷贝 QImag ...

  4. JStorm:任务调度

    前一篇文章 JStorm:概念与编程模型 介绍了JStorm的基本概念以及编程模型方面的知识,本篇主要介绍自己对JStorm的任务调度方面的认识,主要从三个方面介绍: 调度角色 调度方法 自定义调度 ...

  5. 吴裕雄--python学习笔记:sqlite3 模块的使用与学生信息管理系统

    import sqlite3 cx = sqlite3.connect('E:\\student3.db') cx.execute( '''CREATE TABLE StudentTable( ID ...

  6. python标准库-calendar 模块

    原文地址:http://www.bugingcode.com/blog/python_calendar.html calendar 模块是python实现的unix 的 cal命令.它可以以标准的模式 ...

  7. (三)mybatis级联的实现

    mybatis级联的实现 开篇         级联有三种对应关系: 1.一对一(association):如学号与学生  2.一对多(collection):如角色与用户  3.多对多(discri ...

  8. Memcached笔记——(二)XMemcached&Spring集成

    今天研究Memcached的Java的Client,使用XMemcached 1.3.5,做个简单的测试,并介绍如何与Spring集成. 相关链接: Memcached笔记--(一)安装&常规 ...

  9. VMware虚拟机克隆CentOS6.5后修改网卡

         在学习zk伪分布式集群对的时候,第一次注意到克隆虚拟机后修改eth的ip地址,发现ip不是自己修改的ip,进而在询问下发现,当我们第一次登陆查看我们克隆的虚拟机ip时:我们看到的ip不是et ...

  10. 不同环境下的mvn运行指令

    ///////////////// 研发环境 //////////////////////////////////////// 清空环境: mvn clean -DAPP_ENV=dev 建立Ecli ...