定义:

reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。对空数组是不会执行回调函数的。

案例
  1. 计算数组总和
var num = [1,2,3,4,5];
var res = num.reduce(function(total,num){
return total+num;
//return total + Math.round(num);//对数组元素四舍五入并计算总和
},0);
console.log(res);//
//num.reduce((total,num) => total += num, 0);
//没有初始值initialValue(即上面例子中的0),当数组为0时会抛出异常提示reduce函数没有初始值,所以为兼容性一般加上initialValue
  1. 合并二维数组
var red = [[0, 1], [2, 3], [4, 5]].reduce(function(a, b) {
return a.concat(b);
}, []);
console.log(red)
VM291:4 (6) [0, 1, 2, 3, 4, 5]
  1. 统计一个数组中有多少个不重复的单词:
不用reduce时:
var arr = ["apple","orange","apple","orange","pear","orange"];
function getWordCnt(){
var obj = {};
for(var i= 0, l = arr.length; i< l; i++){
var item = arr[i];
obj[item] = (obj[item] +1 ) || 1;
}
return obj;
}
console.log(getWordCnt());
VM3704:14 {apple: 2, orange: 3, pear: 1} 用reduce时:
var arr = ["apple","orange","apple","orange","pear","orange"];
function getWordCnt(){
return arr.reduce(function(prev,next){
prev[next] = (prev[next] + 1) || 1;
return prev;
},{});
}
console.log(getWordCnt());
VM3704:14 {apple: 2, orange: 3, pear: 1}
  1. 对reduce的理解:
    reduce(callback,initiaValue)会传入两个变量,回调函数(callback)和初始值(initiaValue)。
    假设函数有4个传入参数,prev和next,index和array。 Prev和next是你必须要了解的。
    当没有传入初始值时,prev是从数组中第一个元素开始的,next数组是第二个元素。
    但是当传入初始值(initiaValue)后,第一个prev将是initivalValue,next将是数组中的第一个元素。
    比如:
var arr = ["apple","orange"];
function noPassValue(){
return arr.reduce(function(prev,next){
console.log("prev:",prev);
console.log("next:",next);
return prev;
});
} function passValue(){
return arr.reduce(function(prev,next){
console.log("prev:",prev);
console.log("next:",next);
prev[next] = 1;
return prev;
},{});
}
console.log("No Additional parameter:",noPassValue());
console.log("----------------");
console.log("With {} as an additional parameter:",passValue());


VM415673:4 prev: apple
VM415673:5 next: orange
VM415673:4 prev: apple
VM415673:5 next: orange
VM415673:19 No Additional parameter: apple
VM415673:20 ----------------
VM415673:13 prev: {}
VM415673:14 next: apple
VM415673:13 prev: {apple: 1}
VM415673:14 next: orange
VM415673:21 With {} as an additional parameter: {apple: 1, orange: 1}
 

JS --- reduce()函数的更多相关文章

  1. JS中的reduce函数

    海纳百川,有容乃大 定义: reduce()方法接受一个函数作为累加器,数组中的每个值(从左向右)开始缩减,最终计算为一个值.对空数组是不会执行回调函数的. 案例: 计算数组总和: var num = ...

  2. 数组中的reduce 函数理解

    第一次见到reduce 是在js 的高级程序设计中,它的意思是把一个数组减少为一个数,举的例子是数组中元素的求和.它接受一个函数作为参数,函数又有两个参数,一个是prev, 前一个值,一个是next, ...

  3. 循序渐进VUE+Element 前端应用开发(7)--- 介绍一些常规的JS处理函数

    在我们使用VUE+Element 处理界面的时候,往往碰到需要利用JS集合处理的各种方法,如Filter.Map.reduce等方法,也可以设计到一些对象属性赋值等常规的处理或者递归的处理方法,以前对 ...

  4. JS回调函数全解析教程

    转自:http://blog.csdn.net/lulei9876/article/details/8494337 自学jQuery的时候,看到一英文词(Callback),顿时背部隐隐冒冷汗.迅速g ...

  5. 学习js回调函数

    <!DOCTYPE HTML> <html> <head> <meta charset="GBK" /> <title> ...

  6. 如何理解JS回调函数

    1.回调函数英文解释: A callback is a function that is passed as an argument to another function and is execut ...

  7. reduce() 函数

    reduce()函数 reduce()函数也是Python内置的一个高阶函数.reduce()函数接收的参数和 map()类似,一个函数 f,一个list,但行为和 map()不同,reduce()传 ...

  8. Atitit java方法引用(Method References) 与c#委托与脚本语言js的函数指针

    Atitit java方法引用(Method References) 与c#委托与脚本语言js的函数指针   1.1. java方法引用(Method References) 与c#委托与脚本语言js ...

  9. 【转】关于URL编码/javascript/js url 编码/url的三个js编码函数

    来源:http://www.cnblogs.com/huzi007/p/4174519.html 关于URL编码/javascript/js url 编码/url的三个js编码函数escape(),e ...

随机推荐

  1. .NetCore 中使用AppMetrics向InfluxDB中添加监控数据并通过Grafana图像分析

    考虑到分布式部署监控环境是所有的请求情况,所以这一块一般在网关GateWay里面加比较省事,聚合在一起的,如果放在api服务中,如果只有1个还好,一旦部署Node多是很痛苦的事情 这天需要添加的Nug ...

  2. python程序后台运行的实现

    后台运行work()方法. work.py # -*- coding:utf-8 -*- def work(): print "running" import time time. ...

  3. [转]状态压缩dp(状压dp)

    状态压缩动态规划(简称状压dp)是另一类非常典型的动态规划,通常使用在NP问题的小规模求解中,虽然是指数级别的复杂度,但速度比搜索快,其思想非常值得借鉴. 为了更好的理解状压dp,首先介绍位运算相关的 ...

  4. http://blog.mn886.net/jqGrid/

    http://blog.mn886.net/jqGrid/  中文版 http://www.trirand.com/blog/jqgrid/jqgrid.html  英文版

  5. HDU3693 Math Teacher's Homework ---- 数位DP

    HDU3693 Math Teacher's Homework 一句话题意 给定$n, k以及m_1, m_2, m_3, ..., m_n$求$x_1 \oplus x_2 \oplus x_3 \ ...

  6. Codeforces.835E.The penguin's game(交互 按位统计 二分)

    题目链接 \(Description\) 有一个长为\(n\)的序列,其中有两个元素为\(y\),其余全为\(x\).你可以进行\(19\)次询问,每次询问你给出一个下标集合,交互库会返回这些元素的异 ...

  7. BZOJ.1061.[NOI2008]志愿者招募(线性规划 对偶原理 单纯形 / 费用流SPFA)

    题目链接 线性规划 用\(A_{ij}=0/1\)表示第\(i\)天\(j\)类志愿者能否被招募,\(x_i\)为\(i\)类志愿者招募了多少人,\(need_i\)表示第\(i\)天需要多少人,\( ...

  8. [POI2013]Usuwanka

    [POI2013]Usuwanka 题目大意: 一排\(n\)个球,有黑白两种颜色.每取走一个球会在原位置放一个水晶球.求构造一种取球方案,满足: 每次取走\(k\)个白球和\(1\)个黑球: 一次取 ...

  9. Atcoder Grand Contest 010 B - Boxes 差分

    B - Boxes 题目连接: http://agc010.contest.atcoder.jp/tasks/agc010_b Description There are N boxes arrang ...

  10. 关于.net core程序的部署

    最近发布.net core程序的时候,发现它是可以独立部署的,它支持如下两种部署方式: 依赖框架的部署FDD.只发布我们的程序,运行前用户需要手动安装.net core runtime. 独立部署SC ...