大多数情况下,我们都要对数组进行遍历,然后经常用到的两个方法就是forEach和map方法。

先来说说它们的共同点

相同点

  • 都是循环遍历数组中的每一项
  • forEach和map方法里每次执行匿名函数都支持3个参数,参数分别是item(当前每一项),index(索引值),arr(原数组)
  • 匿名函数中的this都是指向window
  • 只能遍历数组
  • 都不会改变原数组

区别

map方法

1.map方法返回一个新的数组,数组中的元素为原始数组调用函数处理后的值。

2.map方法不会对空数组进行检测,map方法不会改变原始数组。

3.浏览器支持:chrome、Safari1.5+、opera都支持,IE9+,

array.map(function(item,index,arr){},thisValue)

var arr = [0,2,4,6,8];
var str = arr.map(function(item,index,arr){
console.log(this); //window
console.log("原数组arr:",arr); //注意这里执行5次
return item/2;
},this);
console.log(str);//[0,1,2,3,4]

若arr为空数组,则map方法返回的也是一个空数组。

forEach方法

1.forEach方法用来调用数组的每个元素,将元素传给回调函数

2.forEach对于空数组是不会调用回调函数的。

Array.forEach(function(item,index,arr){},this)
var arr = [0,2,4,6,8];
var sum = 0;
var str = arr.forEach(function(item,index,arr){
sum += item;
console.log("sum的值为:",sum); //0 2 6 12 20
console.log(this); //window
},this)
console.log(sum);//20
console.log(str); //undefined

无论arr是不是空数组,forEach返回的都是undefined。这个方法只是将数组中的每一项作为callback的参数执行一次。

数组中的forEach和map的区别的更多相关文章

  1. 数组遍历方法forEach 和 map 的区别

    数组遍历方法forEach 和 map 的区别:https://www.cnblogs.com/sticktong/p/7602783.html

  2. js中的forEach和map的区别

    我们先来看两者之间的相同之处 var arr = ['a','b','c','d']; arr.forEach(function(item,index,arr){ //item表示数组中的每一项,in ...

  3. forEach和map的区别,简单写了IE低版本的原形封装

    今天有点'不务正业',旧的没有写完又开新的,没办法 -0- 今天遇到这个特感兴趣嘛入正题了 forEach 和 map 的区别 参考:http://blog.csdn.net/boysky0015/a ...

  4. JS中forEach和map的区别

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

  5. vue 数组遍历方法forEach和map的原理解析和实际应用

    一.前言 forEach和map是数组的两个方法,作用都是遍历数组.在vue项目的处理数据中经常会用到,这里介绍一下两者的区别和具体用法示例. 二.代码 1. 相同点 都是数组的方法 都用来遍历数组 ...

  6. 数组的方法 forEach filter map slice splice

    目前一些数组的实用的方法 1 arr.splice(i,n) 删除从i(索引值)开始之后的那个元素.返回值是删除的元素,改变原数组: 参数: i 索引值      n 个数 let arr = [1, ...

  7. C++中的hash_map和map的区别

    hash_map和map的区别在哪里?构造函数.hash_map需要hash函数,等于函数:map只需要比较函数(小于函数). 存储结构.hash_map采用hash表存储,map一般采用红黑树(RB ...

  8. js 数组API之forEach、map的用法

    forEach语法: arr.forEach(function(value, index, array){--}) 实例: // forEach ,,,,]; arr.forEach(function ...

  9. js删除数组中元素 delete 和splice的区别

    例如我有一个数组: var array = ["aa","dd","cc","aa"] ,我想删除这个数组的“dd”元素 ...

随机推荐

  1. 初识费用流 模板(spfa+slf优化) 餐巾计划问题

    今天学习了最小费用最大流,是网络流算法之一.可以对于一个每条边有一个容量和一个费用(即每单位流的消耗)的图指定一个源点和汇点,求在从源点到汇点的流量最大的前提下的最小费用. 这里讲一种最基础也是最好掌 ...

  2. linux-open-source-development-tools【重点】

    https://www.pluralsight.com/blog/software-development/linux-open-source-development-tools https://ww ...

  3. JDK1.8特性实现jdk动态代理,使业务解耦

    首先,先创建一个interface IHello 目标接口类 interface IHello { void sayHello(); } 然后再写一个目标类的实现类 class HelloImpl i ...

  4. 关于进度管理工具Gantt图

    关于进度管理工具Gantt图 18.以下关于进度管理工具图的叙述中,不正确的是( D). A.能清晰地表达每个任务的开始时间.结束时间和持续时间 B.能清晰地表达任务之间的并行关系 C.不能清晰地确定 ...

  5. ZOJ-3319

    Islands Time Limit: 1 Second      Memory Limit: 32768 KB There are N islands and some directed paths ...

  6. hdu 3081(二分+并查集+最大流||二分图匹配)

    Marriage Match II Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others ...

  7. MVC - 13.验证

    1.注解验证-Required-StringLength-Range-Regular. 1.1.验证方式 [Required], [StringLength], [Range], 和 [Regular ...

  8. 微信小程序radio组件 - 如何改变默认样式大小?

    今天在写小程序的时候用到radio组件,但是很懊恼并未提供修改radio组件大小属性,第一感觉准备用css width , height 改变radio的大小,但是怎么搞也无法改变. 但是又不愿意搞个 ...

  9. mysql安装依赖perl(Data::Dumper)

    http://blog.itpub.net/29989552/viewspace-2128991/

  10. Linux用户和用户组的初步知识

    用户组相关:在Linux系统下,当创建一个如叫tom的用户,那么系统同时会创建一个叫tom的用户组linux中用户的信息都是放在/etc/passwd下的,用户的密码经过加密后放在/etc/shado ...