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

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

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

  可以看出它接收一个回调函数和一个初始值。

  其中total为初始值或者计算后的返回值(必须)、currentValue为当前元素(必须)、currentIndex为当前元素索引(可选)、arr为当前元素所属的对象(可选)、initialValue为传递给函数的初始值

  

  案例1:数组去重

// 数组去重
var arr = [12, 34, 34, 342, 345, 34, 123, 345, 45, 12]
var newArr = arr.reduce(function (prev, next) {
prev.indexOf(next) == -1 && prev.push(next)
return prev
}, [])
console.log(arr) // [12, 34, 34, 342, 345, 34, 123, 345, 45, 12]
console.log(newArr) // [12, 34, 342, 345, 123, 45]

  初始化一个空数组,判断下一个元素是否在当前数组中,不存在则添加到当前数组中。

  案例2:数组中元素求和

// 数组求和
var arr = [1, 2, 3, 4, 5]
var total = arr.reduce(function (prev, next) {
return prev + next
}, 0)
console.log(total)

  将0当做reduce回调函数中的初始值,然后依次累加

  案例3:求数组中最大值或最小值:

// 获取数组中最大值
var arr = [134798, 3478973, 12, 345, 355, 425, 1342356, 3425566, 7908798]
var max = arr.reduce(function (prev, next) {
return Math.max(prev, next) // Math.min(prev, next)
}, 0)
console.log(max)

  

  tips:initialValue为传递给函数的初始值,假如该值不存在时,则回调函数的初始值为数组中的第一项,即回调函数中的prev值

  

javascript之reduce()方法的使用的更多相关文章

  1. JavaScript中reduce()方法

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

  2. 关于javascript 的reduce方法

    作为一个前端菜鸟,觉得资料比较好,特地分享一下~~ reduce() 方法接收一个函数作为累加器(accumulator),数组中的每个值(从左到右)开始缩减,最终为一个值. 你一定也和我一样看的有点 ...

  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. tensorflow优化器-【老鱼学tensorflow】

    tensorflow中的优化器主要是各种求解方程的方法,我们知道求解非线性方程有各种方法,比如二分法.牛顿法.割线法等,类似的,tensorflow中的优化器也只是在求解方程时的各种方法. 比较常用的 ...

  2. Python程序的执行过程原理(解释型语言和编译型语言)

    Python是一门解释型语言?我初学Python时,听到的关于Python的第一句话就是Python是一门解释型语言,我就这样一直相信下去,直到发现.pyc文件的存在,如果真是解释型语言,那么生成的. ...

  3. python基础day3

    一.文件管理 文件管理是很多应用程序的基本功能和重要组成部分.Python可以使文件管理极其简单,特别是和其它语言相对比. 1.    读操作 1.1r模式 1.1.1读取其他路径下文件 首先在D盘创 ...

  4. native的详细用法

    目录 1.JNI:Java Native Interface 3.用C语言编写程序本地方法 一.编写带有 native 声明的方法的java类 二.使用 javac 命令编译所编写的java类,生成. ...

  5. 2019工作计划idea

    2019.2.24 工作需求: 汇总 2008-2018年 销售订单数据; 分类历史订单数据, 并可能采取方法进行预测(预测只是一种行为不代表结果) 目前已知条件: 订单生产周期; 45天(标准天数) ...

  6. kvm虚拟机存储管理

    一.kvm存储虚拟化介绍: 1.KVM 的存储虚拟化是通过存储池(Storage Pool)和卷Volume)来管理的. 2.Storage Pool 是宿主机上可以看到的一片存储空间,可以是多种型 ...

  7. VScode加文件头的方式

    在VScode中添加文件头,设置文件编辑者的方式,在软件中查询到file-header插件: 安装好,此时通过是可以生成默认的文件头.如果需要修改配置,在文件=>首选项=>设置中修改: 查 ...

  8. git创建本地分支以及推送本地分之至远程分支

    Git分支策略 实际开发中,应当按照以下几个基本原则进行管理: 首先,master分支应该是非常稳定的,也就是仅用来发布新版本,平时不能再上边干活. 那在哪干活呢?干活都在dev分支上,也就是说,de ...

  9. 第六章 对象-javaScript权威指南第六版(二)

    通过原型 继承创建一个新对象,对于这一个函数的有说不出的感觉,看看语句都很简单,深层次的东西就是不知道 function inherit(p) { if(p == null)  throw TypeE ...

  10. CentOS7更换国内源

    前言 CentOS 有个很方便的软件安装工具yum,但是默认安装完CentOS,系统里使用的是国外的CentOS更新源,这就造成了我们使用默认更新源安装或者更新软件时速度很慢的问题,甚至更新失败. 为 ...