一直对map、foreach、reduce这些函数很是生疏,今天看underscorejs时好好研究了一下,一研究我就更懵了,这不是一样嘛,都是遍历,所以我就去知乎找了一下,整理出了比较好的几个说法。
假设我们有一个数组,每个元素是一个人。你面前站了一排人。
foreach 就是你按顺序一个一个跟他们做点什么,具体做什么,随便:

people.forEach(function (dude) {
dude.pickUpSoap();});

map 就是你手里拿一个盒子(一个新的数组),一个一个叫他们把钱包扔进去。结束的时候你获得了一个新的数组,里面是大家的钱包,钱包的顺序和人的顺序一一对应。

var wallets = people.map(function (dude) {
return dude.wallet;});

reduce 就是你拿着钱包,一个一个数过去看里面有多少钱啊?每检查一个,你就和前面的总和加一起来。这样结束的时候你就知道大家总共有多少钱了。

var totalMoney = wallets.reduce(function (countedMoney, wallet) {
return countedMoney + wallet.money;}, 0);

补充一个 filter 的:
你一个个钱包数过去的时候,里面钱少于 100 块的不要(留在原来的盒子里),多于 100 块的丢到一个新的盒子里。这样结束的时候你又有了一个新的数组,里面是所有钱多于 100 块的钱包:

var fatWallets = wallets.filter(function (wallet) {
return wallet.money > 100;});

最后要说明一点这个类比和实际代码的一个区别,那就是 map 和 filter 都是 immutable methods,也就是说它们只会返回一个新数组,而不会改变原来的那个数组,所以这里 filter 的例子是和代码有些出入的(原来的盒子里的钱包减少了),但为了形象说明,大家理解就好。

Array.prototype.map = function (fn) {
var resultArray = [];
for (var i = 0,len = this.length; i < len ; i++) {
resultArray[i] = fn.apply(this,[this[i],i,this]);
}
return resultArray;} Array.prototype.forEach = function (fn) {
for (var i = 0,len = this.length; i < len ; i++) {
fn.apply(this,[this[i],i,this]);
}} Array.prototype.reduce= function (fn) {
var formerResult = this[0];
for (var i = 1,len = this.length; i < len ; i++) {
formerResult = fn.apply(this,[formerResult,this[i],i,this]);
}
return formerResult;}

JavaScript 中 map、foreach、reduce 间的区别的更多相关文章

  1. 数组的常用方法concat,join,slice和splice的区别,map,foreach,reduce

    1.concat()和join() concat()是连对两个或两个数组的方法,直接可以将数组以参数的形式放入 join()是将数组中的所有元素放入一个字符串中,通俗点讲就是可以将数组转换成字符串 2 ...

  2. JavaScript中const、var和let区别浅析

    在JavaScript中有三种声明变量的方式:var.let.const.下文给大家介绍js中三种定义变量的方式const, var, let的区别. 1.const定义的变量不可以修改,而且必须初始 ...

  3. 【转】Python 中map、reduce、filter函数

    转自:http://www.blogjava.net/vagasnail/articles/301140.html?opt=admin 介绍下Python 中 map,reduce,和filter 内 ...

  4. JavaScript中值类型和引用类型的区别

    JavaScript的数据类型分为两类:原始类型和对象类型.其中,原始类型包括:数字.字符串和布尔值.此外,JavaScript中还有两个特殊的原始值:null和undefined,它们既不是数字也不 ...

  5. JavaScript中=、==、===以及!=、!==的区别与联系

    JavaScript中=.==.===以及!=.!==的区别与联系   在JavaScript中,“=”代表赋值操作:“==”先转换类型再比较,“===”先判断类型,如果不是同一类型直接为false. ...

  6. Python函数式编程中map()、reduce()和filter()函数的用法

    Python中map().reduce()和filter()三个函数均是应用于序列的内置函数,分别对序列进行遍历.递归计算以及过滤操作.这三个内置函数在实际使用过程中常常和“行内函数”lambda函数 ...

  7. hadoop中map和reduce的数量设置

    hadoop中map和reduce的数量设置,有以下几种方式来设置 一.mapred-default.xml 这个文件包含主要的你的站点定制的Hadoop.尽管文件名以mapred开头,通过它可以控制 ...

  8. JavaScript中object和Object有什么区别

    JavaScript中object和Object有什么区别,为什么用typeof检测对象,返回object,而用instanceof 必须要接Object呢 ————————————————————— ...

  9. JavaScript中Map和ForEach的区别

    译者按: 惯用Haskell的我更爱map. 原文: JavaScript — Map vs. ForEach - What’s the difference between Map and ForE ...

  10. Javascript中数组方法reduce的妙用之处

    Javascript数组方法中,相比map.filter.forEach等常用的迭代方法,reduce常常被我们所忽略,今天一起来探究一下reduce在我们实战开发当中,能有哪些妙用之处,下面从red ...

随机推荐

  1. Solr Python API : SolrCloudpy 与 Pysolr 的 对比

    http://ae.yyuap.com/pages/viewpage.action?pageId=920314 SolrCloudpy文档:http://solrcloudpy.github.io/s ...

  2. django对数据查询结果进行排序的方法

    在你的 Django 应用中,你或许希望根据某字段的值对检索结果排序,比如说,按字母顺序. 那么,使用 order_by() 这个方法就可以搞定了. ? 1 2 >>> Publis ...

  3. VS2015编译Qt5.7.0生成支持XP的静态库(很不错)

    一.编译工具 1.VS2015 编译Qt5.7.0的所需VS版本:Visual Studio 2013 (Update1)或Visual Studio 2015 (Update2).因为Update补 ...

  4. ionic实现点击popup区域外部分来关闭popup

    var htmlEl = angular.element(document.querySelector('html')); htmlEl.on('click', function (event) { ...

  5. python gevent 协程

    简介 没有切换开销.因为子程序切换不是线程切换,而是由程序自身控制,没有线程切换的开销,因此执行效率高, 不需要锁机制.因为只有一个线程,也不存在同时写变量冲突,在协程中控制共享资源不加锁,只需要判断 ...

  6. sqlserver日志的备份与还原

    ----------完整备份与还原----------                --完整备份数据库--backup database studb to disk='e:\stu.bak'back ...

  7. Linux命令集合

    系统信息 arch 显示机器的处理器架构(1) uname -m 显示机器的处理器架构(2) uname -r 显示正在使用的内核版本 dmidecode -q 显示硬件系统部件 - (SMBIOS ...

  8. jQuery .attr("checked")得undefined 问题解决

    出现此错误是因为JQuery版本升级的问题.所以此处应该使用.prop(); 那么,什么时候使用attr(),什么时候使用prop()?1.添加属性名称该属性就会生效应该使用prop();2.是有tr ...

  9. NOI 1.5 44:第n小的质数

    ---恢复内容开始--- 描述 输入一个正整数n,求第n小的质数. 输入 一个不超过10000的正整数n. 输出 第n小的质数. 样例输入 10 样例输出 29 方法1:合数一定可以表示成一个比它小的 ...

  10. github android

    作者:ruijun 链接:https://www.zhihu.com/question/37160415/answer/79569042 来源:知乎 著作权归作者所有,转载请联系作者获得授权. ### ...