forEach和map区别在哪里知道吗?

 // forEach
Array.prototype.forEach(callback(item, index, thisArr), thisArg) // map
Array.prototype.map(callback(item, index, thisArr), thisArg)

大致看一下,感觉参数都一样,都是用于循环.

他们之间的区别在于,map的callback是可以return的,但forEach并不可以.

map 方法会给原数组中的每个元素都按顺序调用一次  callback 函数。callback 每次执行后的返回值(包括 undefined)组合起来形成一个新数组。 callback 函数只会在有值的索引上被调用;那些从来没被赋过值或者使用 delete 删除的索引则不会被调用。

好,我们来看一个例子

 // 快速生成1-100的数组

 let res = Array.from(new Array(100)).map((x,y) => y) 

 res  // [1,2,3,4..., 100]

如果将map换成forEach

 let res = Array.from(new Array(100)).forEach((x, y) => y)

 res // undefined

forEach() 为每个数组元素执行一次 callback 函数;与 map() 或者 reduce() 不同的是,它总是返回 undefined 值

因为forEach的callback没有返回值,所以forEach循环不能执行  链式操作.

所以如果要使用map或forEach循环的话,可以考虑下面的建议

因为map生成一个新数组,当你不打算使用返回的新数组却使用map是违背设计初衷的,请用forEach或者for-of替代。你不该使用map:

A)你不打算使用返回的新数组,或/且 B) 你没有从回调函数中返回值。

摘要: 
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach

ES5中, map 和 forEach的区别的更多相关文章

  1. JS中map与forEach的区别

    很多同学可能对于map与forEach的区别不是太了解,今天我们介绍一下JS中的map与forEach方法, 我对map的理解是,这个方法对一个数组arr1中的每一个元素进行遍历(传递给一个数组,参数 ...

  2. JavaScript中Map和ForEach的区别

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

  3. JS中map和foreach的区别以及some和every的用法

    一.原生JS forEach()和map()遍历 共同点: 1.都是循环遍历数组中的每一项. 2.forEach() 和 map() 里面每一次执行匿名函数都支持3个参数:数组中的当前项item,当前 ...

  4. JS中Map和ForEach的区别

    定义 forEach()方法: 针对每一个元素执行提供的函数. map()方法: 创建一个新的数组,其中每一个元素由调用数组中的每一个元素执行提供的函数得来. 区别 forEach()方法不会返回执行 ...

  5. JS中map()与forEach()的区别和用法

    相同点: 1.都是循环遍历数组中的每一项 2.每次执行匿名函数都支持三个参数,参数分别为item(当前每一项),index(索引值),arr(原数组) 3.匿名函数中的this都是指向window 4 ...

  6. 原 c++中map与unordered_map的区别

    c++中map与unordered_map的区别 头文件 map: #include < map > unordered_map: #include < unordered_map ...

  7. JavaScript 中 map、foreach、reduce 间的区别

    一直对map.foreach.reduce这些函数很是生疏,今天看underscorejs时好好研究了一下,一研究我就更懵了,这不是一样嘛,都是遍历,所以我就去知乎找了一下,整理出了比较好的几个说法. ...

  8. Javascript的map与forEach的区别

    原理: 高级浏览器支持forEach方法语法:forEach和map都支持2个参数:一个是回调函数(item,index,list)和上下文: forEach:用来遍历数组中的每一项:这个方法执行是没 ...

  9. ES5中新增的forEach等新方法的一些使用声明

    转载地址:http://www.zhangxinxu.com/wordpress/?p=3220 一.前言-索引 ES5中新增的不少东西,了解之对我们写JavaScript会有不少帮助,比如数组这块, ...

随机推荐

  1. Android View框架的layout机制

    概述 Android中View框架的工作机制中,主要有三个过程: 1.View树的测量(measure) Android View框架的measure机制 2.View树的布局(layout)Andr ...

  2. 0级搭建类008-Ubuntu Server Linux安装 (18.04.2) 公开

    项目文档引子系列是根据项目原型,制作的测试实验文档,目的是为了提升项目过程中的实际动手能力,打造精品文档AskScuti. 项目文档引子系列目前不对外发布,仅作为博客记录.如学员在实际工作过程中需提前 ...

  3. 粒子群算法优化BP生物能神经网络

    定义: 粒子群中每个粒子的位置表示BP神经网络当前迭代中权值的集合,每个粒子的维数由网络中起连接作用的权值的数量和阈值个数决定,以给定训练样本集的神经网络输出误差作为神经网络训练问题的适应度函数,适应 ...

  4. 532-数组中的K-diff数对

    532-数组中的K-diff数对 给定一个整数数组和一个整数 k, 你需要在数组里找到不同的 k-diff 数对.这里将 k-diff 数对定义为一个整数对 (i, j), 其中 i 和 j 都是数组 ...

  5. jsonp 完成跨域请求注意事项

    jsonp 不支持post方式请求跨域数据 可以使用get方式请求 !jsonp 不支持post方式请求跨域数据 可以使用get方式请求 !jsonp 不支持post方式请求跨域数据 可以使用get方 ...

  6. vuejs在解析时出现闪烁的原因及防止闪烁的方法

    原因: 在使用vuejs.angularjs开发时,经常会遇见在如Chrome这类能够快速解析的浏览器上出现表达式({{ express }} ),或者是模块(div)的闪烁.对于这个问题由于Java ...

  7. SDOI2010 粟粟的书架 lg2468(可持久化,前缀和)

    题面见https://www.luogu.org/problemnew/show/P2468 然后这道题属于合二为一题,看一眼数据范围就能发现 首先我们先考虑50分,二维前缀和维护一下(反正我不记得公 ...

  8. 使用饿了么el-date-picker里及如何将后台给的时间戳js转化为时间格式

    首先代码是这个样子的,使用v-model <el-date-picker v-model="formData.createTime" :disabled="true ...

  9. 【做题笔记】洛谷P1506 拯救oibh总部

    跑一遍染色法,最后判断哪些位置没被染色即可 一些技巧: 为了判断方便,把字符转换成 int 型的数字. 注意边界问题 详细解释见代码 #include <iostream> #includ ...

  10. laravel如何向视图传递值

    1.定义路由 Route::get('demo','DemoController@demo'); 2.定义控制器(内with();方法就是定义传递的值 key=>value)=>" ...