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 相关文章推荐
jQuery下的动画处理总结
Oct 10 Javascript
jQuery插件datalist实现很好看的input下拉列表
Jul 14 Javascript
JS的框架Polymer中的dom-if和is属性使用说明
Jul 29 Javascript
如何解决谷歌浏览器下jquery无法获取图片的尺寸
Sep 10 Javascript
js父页面中使用子页面的方法
Jan 09 Javascript
JS组件Bootstrap dropdown组件扩展hover事件
Apr 17 Javascript
jQuery中事件与动画的总结分享
May 24 Javascript
微信小程序中使元素占满整个屏幕高度实现方法
Dec 14 Javascript
jQuery实现在HTML文档加载完毕后自动执行某个事件的方法
May 08 jQuery
浅谈对Angular中的生命周期钩子的理解
Jul 31 Javascript
详解ESLint在Vue中的使用小结
Oct 15 Javascript
使用VUE实现在table中文字信息超过5个隐藏鼠标移到时弹窗显示全部
Sep 16 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
我的论坛源代码(八)
2006/10/09 PHP
php输出xml必须header的解决方法
2014/10/17 PHP
php自动加载方式集合
2016/04/04 PHP
PHP识别二维码的方法(php-zbarcode安装与使用)
2016/07/07 PHP
ThinkPHP5.0框架使用build 自动生成模块操作示例
2019/04/11 PHP
thinkphp5.1框架模板赋值与变量输出示例
2020/05/25 PHP
JS 图片缩放效果代码
2010/06/09 Javascript
Javascript匿名函数的一种应用 代码封装
2010/06/27 Javascript
js 时间函数应用加、减、比较、格式转换的示例代码
2013/08/23 Javascript
JavaScript charCodeAt方法入门实例(用于取得指定位置字符的Unicode编码)
2014/10/17 Javascript
javascript正则表达式基础知识入门
2015/04/20 Javascript
不想让浏览器运行javascript脚本的方法
2015/11/20 Javascript
javascript加载xml 并解析各节点的值(实现方法)
2016/10/12 Javascript
js获取一组日期中最近连续的天数
2017/05/25 Javascript
JS实现闭包中的沙箱模式示例
2017/09/07 Javascript
js实现图片粘贴上传到服务器并展示的实例
2017/11/08 Javascript
详解webpack3编译兼容IE8的正确姿势
2017/12/21 Javascript
js+html实现周岁年龄计算器
2019/06/25 Javascript
如何优雅地取消 JavaScript 异步任务
2020/03/22 Javascript
原生js+css实现tab切换功能
2020/09/17 Javascript
[01:48]2018DOTA2亚洲邀请赛主赛事第二日五佳镜头 VG完美团战逆转TNC
2018/04/05 DOTA
Python安装第三方库的3种方法
2015/06/21 Python
总结Python编程中函数的使用要点
2016/03/20 Python
python实现汉诺塔方法汇总
2016/07/25 Python
Python面向对象程序设计之继承与多继承用法分析
2018/07/13 Python
解决pycharm回车之后不能换行或不能缩进的问题
2019/01/16 Python
flask应用部署到服务器的方法
2019/07/12 Python
python 3.7.4 安装 opencv的教程
2019/10/10 Python
pytorch 模拟关系拟合——回归实例
2020/01/14 Python
使用python matploblib库绘制准确率,损失率折线图
2020/06/16 Python
Python命名空间及作用域原理实例解析
2020/08/12 Python
英国电子产品购物网站:TobyDeals
2018/07/30 全球购物
存储过程和sql语句的优缺点
2014/07/02 面试题
Java中采用什么结构来捕获、处理异常?各子句的顺序、功能如何
2013/10/07 面试题
中专生自我鉴定范文
2013/12/19 职场文书
工作检讨书500字
2014/10/19 职场文书