JavaScript之map reduce_动力节点Java学院整理


Posted in Javascript onJune 29, 2017

如果你读过Google的那篇大名鼎鼎的论文“MapReduce: Simplified Data Processing on Large Clusters”,你就能大概明白map/reduce的概念。

map

举例说明,比如我们有一个函数f(x)=x2,要把这个函数作用在一个数组[1, 2, 3, 4, 5, 6, 7, 8, 9]上,就可以用map实现如下:

JavaScript之map reduce_动力节点Java学院整理

由于map()方法定义在JavaScript的Array中,我们调用Arraymap()方法,传入我们自己的函数,就得到了一个新的Array作为结果:

function pow(x) {
  return x * x;
}

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
arr.map(pow); // [1, 4, 9, 16, 25, 36, 49, 64, 81]

map()传入的参数是pow,即函数对象本身。
你可能会想,不需要map(),写一个循环,也可以计算出结果:

var f = function (x) {
  return x * x;
};

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
var result = [];
for (var i=0; i<arr.length; i++) {
  result.push(f(arr[i]));
}

的确可以,但是,从上面的循环代码,我们无法一眼看明白“把f(x)作用在Array的每一个元素并把结果生成一个新的Array”。
所以,map()作为高阶函数,事实上它把运算规则抽象了,因此,我们不但可以计算简单的f(x)=x2,还可以计算任意复杂的函数,比如,把Array的所有数字转为字符串:

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
arr.map(String); // ['1', '2', '3', '4', '5', '6', '7', '8', '9']

只需要一行代码。

reduce

再看reduce的用法。Array的reduce()把一个函数作用在这个Array[x1, x2, x3...]上,这个函数必须接收两个参数,reduce()把结果继续和序列的下一个元素做累积计算,其效果就是:

[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)

比方说对一个Array求和,就可以用reduce实现:

var arr = [1, 3, 5, 7, 9];
arr.reduce(function (x, y) {
  return x + y;
}); // 25

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
网页前台通过js非法字符过滤代码(骂人的话等等)
May 26 Javascript
关于Javascript 对象(object)的prototype
May 09 Javascript
jquery实现动态操作select选中
Feb 11 Javascript
JavaScript检测浏览器cookie是否已经启动的方法
Feb 27 Javascript
JavaScript中Number.NEGATIVE_INFINITY值的使用详解
Jun 05 Javascript
jQuery使用模式窗口实现在主页面和子页面中互相传值的方法
Mar 01 Javascript
JS 滚动事件window.onscroll与position:fixed写兼容IE6的回到顶部组件
Oct 10 Javascript
js中数组插入、删除元素操作的方法
Feb 15 Javascript
数组Array的一些方法(总结)
Feb 17 Javascript
JS组件系列之MVVM组件 vue 30分钟搞定前端增删改查
Apr 28 Javascript
微信小程序中多个页面传参通信的学习与实践
May 05 Javascript
js实现购物车商品数量加减
Sep 21 Javascript
Angular 2 ngForm中的ngModel、[ngModel]和[(ngModel)]的写法
Jun 29 #Javascript
JavaScript之iterable_动力节点Java学院整理
Jun 29 #Javascript
JavaScript之Map和Set_动力节点Java学院整理
Jun 29 #Javascript
JavaScript之面向对象_动力节点Java学院整理
Jun 29 #Javascript
JavaScript之json_动力节点Java学院整理
Jun 29 #Javascript
JavaScript之RegExp_动力节点Java学院整理
Jun 29 #Javascript
详解微信小程序设置底部导航栏目方法
Jun 29 #Javascript
You might like
迅雷下载《中学科技》怀旧期刊下载
2021/02/27 无线电
Apache+php+mysql在windows下的安装与配置图解(最新版)
2008/11/30 PHP
PHP如何实现订单的延时处理详解
2017/12/30 PHP
php的命名空间与自动加载实现方法
2019/08/25 PHP
JavaScript中实现块作用域的方法
2010/04/01 Javascript
ASP.NET jQuery 实例9  通过控件hyperlink实现返回顶部效果
2012/02/03 Javascript
子窗体与父窗体传值示例js代码
2013/08/01 Javascript
js 获取radio按钮值的实例
2013/08/17 Javascript
onkeyup,onkeydown和onkeypress的区别介绍
2013/10/21 Javascript
SpringMVC返回json数据的三种方式
2015/12/10 Javascript
React Native实现简单的登录功能(推荐)
2016/09/19 Javascript
纯js实现倒计时功能
2017/01/06 Javascript
基于node.js之调试器详解
2017/08/22 Javascript
jQuery中each方法的使用详解
2018/03/18 jQuery
ios设备中angularjs无法改变页面title的解决方法
2018/09/13 Javascript
vue页面切换过渡transition效果
2018/10/08 Javascript
javascrit中undefined和null的区别详解
2019/04/07 Javascript
vue项目创建步骤及路由router
2020/01/14 Javascript
JS实现canvas简单小画板功能
2020/06/23 Javascript
[58:18]2018DOTA2亚洲邀请赛3月29日 小组赛B组 iG VS Mineski
2018/03/30 DOTA
[36:13]Mineski vs iG 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
Python实现嵌套列表及字典并按某一元素去重复功能示例
2017/11/30 Python
Python使用xlwt模块操作Excel的方法详解
2018/03/27 Python
Pycharm代码无法复制,无法选中删除,无法编辑的解决方法
2018/10/22 Python
Python文件夹批处理操作代码实例
2020/07/21 Python
用CSS禁用输入法(CSS3 UI规范)实例解析
2012/12/04 HTML / CSS
英国最大的线上保健品零售商之一:Vitamin Planet
2016/12/01 全球购物
台湾东南旅游社网站:东南旅游
2019/02/11 全球购物
灵泰克Java笔试题
2016/01/09 面试题
医学护理系毕业生求职信
2013/10/01 职场文书
总裁岗位职责
2013/12/04 职场文书
临时租车协议范本
2014/09/23 职场文书
2014年宣传工作总结
2014/11/18 职场文书
心得体会该怎么写呢?
2019/06/27 职场文书
OpenCV实现普通阈值
2021/11/17 Java/Android
windows系统安装配置nginx环境
2022/06/28 Servers