ES5中, map 和 forEach的区别
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的区别的更多相关文章
- JS中map与forEach的区别
很多同学可能对于map与forEach的区别不是太了解,今天我们介绍一下JS中的map与forEach方法, 我对map的理解是,这个方法对一个数组arr1中的每一个元素进行遍历(传递给一个数组,参数 ...
- JavaScript中Map和ForEach的区别
译者按: 惯用Haskell的我更爱map. 原文: JavaScript — Map vs. ForEach - What’s the difference between Map and ForE ...
- JS中map和foreach的区别以及some和every的用法
一.原生JS forEach()和map()遍历 共同点: 1.都是循环遍历数组中的每一项. 2.forEach() 和 map() 里面每一次执行匿名函数都支持3个参数:数组中的当前项item,当前 ...
- JS中Map和ForEach的区别
定义 forEach()方法: 针对每一个元素执行提供的函数. map()方法: 创建一个新的数组,其中每一个元素由调用数组中的每一个元素执行提供的函数得来. 区别 forEach()方法不会返回执行 ...
- JS中map()与forEach()的区别和用法
相同点: 1.都是循环遍历数组中的每一项 2.每次执行匿名函数都支持三个参数,参数分别为item(当前每一项),index(索引值),arr(原数组) 3.匿名函数中的this都是指向window 4 ...
- 原 c++中map与unordered_map的区别
c++中map与unordered_map的区别 头文件 map: #include < map > unordered_map: #include < unordered_map ...
- JavaScript 中 map、foreach、reduce 间的区别
一直对map.foreach.reduce这些函数很是生疏,今天看underscorejs时好好研究了一下,一研究我就更懵了,这不是一样嘛,都是遍历,所以我就去知乎找了一下,整理出了比较好的几个说法. ...
- Javascript的map与forEach的区别
原理: 高级浏览器支持forEach方法语法:forEach和map都支持2个参数:一个是回调函数(item,index,list)和上下文: forEach:用来遍历数组中的每一项:这个方法执行是没 ...
- ES5中新增的forEach等新方法的一些使用声明
转载地址:http://www.zhangxinxu.com/wordpress/?p=3220 一.前言-索引 ES5中新增的不少东西,了解之对我们写JavaScript会有不少帮助,比如数组这块, ...
随机推荐
- mysql 数据备份。pymysql模块
阅读目录 一 IDE工具介绍 二 MySQL数据备份 三 pymysql模块 一 IDE工具介绍 生产环境还是推荐使用mysql命令行,但为了方便我们测试,可以使用IDE工具 下载链接:https:/ ...
- Netty中CompositeByteBuf的理解以及读写操作
转载请注明出处 https://www.cnblogs.com/majianming/articles/the_composite_byte_buf_read_and_wite_operation_o ...
- JS获取样式
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- Cenos7 学习笔记
一.nmtui nmtui——Text User Interface for controlling NetworkManager,这是一个NetworkManager服务的网卡接口配置工具,能实现在 ...
- IDEA全局搜索
搜索文件名:连续按两下Shift键 搜索字符串:Ctrl + Shift +F
- 题解【AcWing883】高斯消元解线性方程组
题面 高斯消元模板题. 这里直接讲述一下高斯消元的算法流程: 枚举每一列 \(c\): 找到第 \(c\) 列绝对值最大的一行: 将这一行换到最上面: 将该行的第一个数变成 \(1\): 将下面所有行 ...
- Yaf自定义autoload以实现Model文件和Controller文件命名区分
先上图: 由于Yaf作者在设计Yaf框架目录时没有直接区分开models文件和controllers文件,所以在IDE看着会很难受,眼睛离开了编辑器就不大好区分这两个文件夹的文件.所以自己写了一个au ...
- linux - python - 异常:error while loading shared libraries
问题描述 error while loading shared libraries: libpython2.7.so.1.0: cannot open shared object file: No s ...
- 18家大厂Java面试题整理了350道(分布式+微服务+高并发)
一.性能调优系列 1.Tomcat性能调优 JVM参数调优: -Xms 表示JVM初始化堆的大小, -Xmx表示JVM堆的最大值.这两个值的大小一般根据需要进行设置. 当应用程序需要的内存超出堆的最大 ...
- python使用selenium驱动chromium防止浏览器自动升级失效!
python爬虫或者自动化项目中有时会用到selenium自动化测试框架,驱动chrom时由于谷歌浏览器自动升级,会造成驱动和浏览器版本不匹配问题,这时可以用到Chromium,这是谷歌推出用于开发目 ...