大多数情况下,我们都要对数组进行遍历,然后经常用到的两个方法就是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. esp8266 IOT Demo 固件刷写记录

    将编译好的固件按照下面地址刷写到esp8266 出现下面错误是因为刷写的设置不对,按照图上设置: load 0x40100000, len 26828, room 16 tail 12chksum 0 ...

  2. netlink socket编程

    转载 原文地址:netlink socket编程之why & how (转) 作者:renyuan000 作者: Kevin Kaichuan He@2005-1-5 翻译整理:duanjig ...

  3. copy_from_user分析

    前言 copy_from_user函数的目的是从用户空间拷贝数据到内核空间,失败返回没有被拷贝的字节数,成功返回0.它内部的实现当然不仅仅拷贝数据,还需要考虑到传入的用户空间地址是否有效,比如地址是不 ...

  4. .gitignore 文件添加或更新后规则无效的解决方案

    项目已经提交之后,突然想忽略某个文件或目录 A,于是在 .gitignore 里添加了忽略规则.但是提交(commit)之后,发现一旦修改了 A,git 同样会检测到 A 的变化(changes) , ...

  5. device tree --- label

    [label:] <device node name>[@ unit-address] 為 device node 取 label name, 可以在其它位置使用 &label 存 ...

  6. 调用start()与run()的区别

    1.调用start()方法: 通知“线程规划器”当前线程已经准备就绪,等待调用线程对象的run()方法.这个过程就是让系统安排一个时间来调用Thread中的run()方法,使线程得到运行,启动线程,具 ...

  7. hadoop环境搭建编译

    安装: JDK1.7+ maven 3.0 or later findbugs 1.3.9 protocolBuffer 2.5.0 cmake 2.6 zlib-devel openssl-deve ...

  8. 微信小程序时钟(xx年xx月xx日xx:xx格式)

    wxml: <view>时间:{{newTime}}</view> js: page({ data:{ newTime:'' }, onLoad: function (opti ...

  9. hadoop-Rpc使用实例

    代码:https://github.com/xufeng79x/hadoop-common-rpc-demo 1. 简介 hadoop中使用rpc机制来进行分布式进程间的通信,被封装进了hadoop- ...

  10. textarea在浏览器中固定大小

    HTML 标签 textarea 在大部分浏览器中只要指定行(rows)和列(cols)属性,就可以规定 textarea 的尺寸,大小就不会改变,不过更好的办法是使用 CSS 的 height 和 ...