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 相关文章推荐
javascript 对象比较实现代码
Apr 27 Javascript
js 动态选中下拉框
Nov 26 Javascript
关于JAVASCRIPT urldecode URL解码的问题
Jan 08 Javascript
jqgrid 编辑添加功能详细解析
Nov 08 Javascript
js实现的牛顿摆效果
Mar 31 Javascript
jQuery的animate函数实现图文切换动画效果
May 03 Javascript
轻松实现jquery手风琴效果
Jan 14 Javascript
BootStrap实现鼠标悬停下拉列表功能
Feb 17 Javascript
微信小程序实现登录遮罩效果
Nov 01 Javascript
详解js动态获取浏览器或页面等容器的宽高
Mar 13 Javascript
微信小程序实现左侧滑动导航栏
Apr 08 Javascript
vue实现员工信息录入功能
Jun 11 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/03/01 无线电
支持oicq头像的留言簿(二)
2006/10/09 PHP
PHP中__FILE__、dirname与basename用法实例分析
2014/12/01 PHP
PHP根据session与cookie用户登录状态操作类的代码
2016/05/13 PHP
使用户点击后退按钮使效三行代码
2007/07/07 Javascript
jQuery EasyUI NumberBox(数字框)的用法
2010/07/08 Javascript
seajs1.3.0源码解析之module依赖有序加载
2012/11/07 Javascript
js querySelector() 使用方法
2016/12/21 Javascript
React Router基础使用
2017/01/17 Javascript
js, jQuery实现全选、反选功能
2017/03/08 Javascript
jQuery手风琴的简单制作
2017/05/12 jQuery
js的函数的按值传递参数(实例讲解)
2017/11/16 Javascript
Javascript将图片的绝对路径转换为base64编码的方法
2018/01/11 Javascript
vue移动UI框架滑动加载数据的方法
2018/03/12 Javascript
解决Vue axios post请求,后台获取不到数据的问题方法
2018/08/11 Javascript
vue填坑之webpack run build 静态资源找不到的解决方法
2018/09/03 Javascript
关于AngularJS中ng-repeat不更新视图的解决方法
2018/09/30 Javascript
vue项目中使用Hbuilder打包app 设置沉浸式状态栏的方法
2018/10/22 Javascript
Vue指令实现OutClick的示例
2020/11/16 Javascript
[43:43]完美世界DOTA2联赛PWL S2 LBZS vs Forest 第三场 11.29
2020/12/02 DOTA
使用Python的Twisted框架编写简单的网络客户端
2015/04/16 Python
浅谈flask源码之请求过程
2018/07/26 Python
解决tensorflow训练时内存持续增加并占满的问题
2020/01/19 Python
python怎么对数字进行过滤
2020/07/05 Python
python logging 重复写日志问题解决办法详解
2020/08/04 Python
用html5实现语音搜索框的方法
2014/03/18 HTML / CSS
荷兰超市:DEEN
2018/03/14 全球购物
机关财务管理制度
2014/01/17 职场文书
党的群众路线教育实践活动总结报告
2014/07/03 职场文书
校园学雷锋广播稿
2014/10/08 职场文书
三十年同学聚会致辞
2015/07/28 职场文书
电工实训心得体会
2016/01/14 职场文书
解决Tkinter中button按钮未按却主动执行command函数的问题
2021/05/23 Python
Spring实现内置监听器
2021/07/09 Java/Android
vue实现可以快进后退的跑马灯组件
2022/04/08 Vue.js
前端canvas中物体边框和控制点的实现示例
2022/08/05 Javascript