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 EasyUI API 中文文档 可调整尺寸
Sep 29 Javascript
jquery应该如何来设置改变按钮input的onclick事件
Dec 10 Javascript
原生JS实现美图瀑布流布局赏析
Sep 07 Javascript
关于javascript原型的修改与重写(覆盖)差别详解
Aug 31 Javascript
JS焦点图,JS 多个页面放多个焦点图的实例
Dec 08 Javascript
jQuery实现选中行变色效果(实例讲解)
Jul 06 jQuery
node koa2实现上传图片并且同步上传到七牛云存储
Jul 31 Javascript
详谈js对url进行编码和解码(三种方式的区别)
Aug 16 Javascript
jquery3和layui冲突导致使用layui.layer.full弹出全屏iframe窗口时高度152px问题
May 12 jQuery
vue用BMap百度地图实现即时搜索功能
Sep 26 Javascript
从0到1学习JavaScript编写贪吃蛇游戏
Jul 28 Javascript
浅谈vue获得后台数据无法显示到table上面的坑
Aug 13 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
全国FM电台频率大全 - 7 吉林省
2020/03/11 无线电
PHP程序级守护进程的实现与优化的使用概述
2013/05/02 PHP
ThinkPHP中自定义目录结构的设置方法
2014/08/15 PHP
php中限制ip段访问、禁止ip提交表单的代码分享
2014/08/22 PHP
详解HTTP Cookie状态管理机制
2016/01/14 PHP
PHP实现文件上传功能实例代码
2017/05/18 PHP
JS文本框追加多个下拉框的值的简单实例
2013/07/12 Javascript
node.js中的fs.lchownSync方法使用说明
2014/12/16 Javascript
js判断登录与否并确定跳转页面的方法
2015/01/30 Javascript
JS实现图片的不间断连续滚动的简单实例
2016/06/03 Javascript
Vue.js实现可配置的登录表单代码详解
2018/03/29 Javascript
深入理解JS的事件绑定、事件流模型
2018/05/13 Javascript
vue基于v-charts封装双向条形图的实现代码
2019/12/09 Javascript
JS控制下拉列表左右选择实例代码
2020/05/08 Javascript
[02:40]DOTA2英雄基础教程 巨牙海民
2013/12/23 DOTA
在Python中使用成员运算符的示例
2015/05/13 Python
Python3操作SQL Server数据库(实例讲解)
2017/10/21 Python
Python Web程序部署到Ubuntu服务器上的方法
2018/02/22 Python
用Django实现一个可运行的区块链应用
2018/03/08 Python
Django中的ajax请求
2018/10/19 Python
总结python中pass的作用
2019/02/27 Python
python实现微信机器人: 登录微信、消息接收、自动回复功能
2019/04/29 Python
Python3.6+Django2.0以上 xadmin站点的配置和使用教程图解
2019/06/04 Python
numpy中三维数组中加入元素后的位置详解
2019/11/28 Python
pytorch三层全连接层实现手写字母识别方式
2020/01/14 Python
python add_argument()用法解析
2020/01/29 Python
Python字符串三种格式化输出
2020/09/17 Python
用python爬虫批量下载pdf的实现
2020/12/01 Python
详解Python Celery和RabbitMQ实战教程
2021/01/20 Python
佳能加拿大网上商店:Canon eStore Canada
2018/04/04 全球购物
Gina Bacconi官网:吉娜贝康尼连衣裙和礼服
2018/04/24 全球购物
司机岗位职责
2013/11/15 职场文书
临床医师个人自我评价
2014/04/06 职场文书
文体活动总结范文
2014/05/05 职场文书
公司副总经理岗位职责
2015/04/08 职场文书
Django实现翻页的示例代码
2021/05/24 Python