相同点:

1.都是循环遍历数组中的每一项

2.每次执行匿名函数都支持三个参数,参数分别为item(当前每一项),index(索引值),arr(原数组)

3.匿名函数中的this都是指向window

4.只能遍历数组

不同点:

map()

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

也就是map()进行处理之后返回一个新的数组

⚠️注意:map()方法不会对空数组进行检测

map方法不会改变原始数组

var arr = [0,2,4,6,8];
var str = arr.map(function(item,index,arr){
console.log(this); //Window
console.log(this);
console.log(item);
console.log('原数组arr:',arr); // 会执行五次
return item/2;},this);console.log(str); //[0,1,2,3,4]
forEach

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

⚠️注意: forEach对于空数组是不会调用回调函数的 ,

没有返回一个新数组&没有返回值

应用场景:为一些相同的元素,绑定事件处理器!

不可链式调用

var arr = [0,2,4,6,8]

var sum =0;

var str = arr.forEach(item,index.arr){sum+= item;console.log("sum的值为:",sum);})

JS中map()与forEach()的区别和用法的更多相关文章

  1. JS中map与forEach的区别

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

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

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

  3. JS中Map和ForEach的区别

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

  4. JavaScript中Map和ForEach的区别

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

  5. ES5中, map 和 forEach的区别

    forEach和map区别在哪里知道吗? // forEach Array.prototype.forEach(callback(item, index, thisArr), thisArg) // ...

  6. JS中map、forEach、filter、reduce等Array新增方法的区别

    数组在各个编程语言中的重要性不言而喻,但是在之前的JavaScript中数组虽然功能已经很强大,但操作方法并不完善,在ECMAScript5中做了适当的补充. Array.isArray(elemen ...

  7. JS中for和forEach的区别

    https://thejsguy.com/2016/07/30/javascript-for-loop-vs-array-foreach.html

  8. JS中apply和call的区别和用法

    Javascript中有一个call和apply方法,其作用基本相同,但是它们也有略微不同的地方. JS手册中对call方法的解释是: call方法:调用一个对象的一个方法,以另一个对象替换当前对象. ...

  9. Js中Map对象的使用

    Js中Map对象的使用 1.定义 键/值对的集合. 2.语法 mapObj = new Map() 3.备注 集合中的键和值可以是任何类型.如果使用现有密钥向集合添加值,则新值会替换旧值. 4.属性 ...

随机推荐

  1. centos7安装hadoop完全分布式集群

    groupadd test             //新建test工作组 useradd -g test phpq        //新建phpq用户并增加到test工作组 userdel 选项 用 ...

  2. ORACLE导入数据库详细步骤

    登录PLSQL 点击然后打开命令窗口执行命令 创建表空间(红色字体是你需要创建表空间的地址,蓝色的是表空间大小) create temporary tablespace ZJY_TEMP tempfi ...

  3. 【POJ - 1979 】Red and Black(dfs+染色)

    -->Red and Black Descriptions: 有个铺满方形瓷砖的矩形房间,每块瓷砖的颜色非红即黑.某人在一块砖上,他可以移动到相邻的四块砖上.但他只能走黑砖,不能走红砖. 敲个程 ...

  4. Oracle数据库---异常处理

    Oracle异常处理在PL/SQL语句书写时,需要处理的异常-- 不做异常处理时DECLARE v_name emp.ename%TYPE; v_sal emp.sal%TYPE;BEGIN SELE ...

  5. py+selenium 明明定位不到元素,但却不报错或是报错AttributeError: 'list' object has no attribute 'click'【已解决】

    问题:定位不到元素,但却不报错或者出现报错AttributeError: 'list' object has no attribute 'click' 如图  或者  解决方法:   将”driver ...

  6. css基础4

    今天是2019年6月21日,周五了.在这里写上一篇随笔,主要内容是css基础中的一些细节部分,话不多说,直接上! 一.背景渐变: background-image 线性渐变:linear-gradie ...

  7. Oracle 学习笔记二

    一.oracle通用函数vnl(a,b) 用于任何类型,如果a的值不为null返回a的值否则返回b的值 条件判断oracle中可以使用 case 字段 when 条件1 then 表达式1 when ...

  8. sublime 如何安装插件实现高效输入,如何支持markdown 语法,并实时预览

    啊,一直想鼓捣markdown的语法,但是配置什么的有点麻烦.不过用起来的话,真心顺手.无需考虑格式与语法点来点去影响效率, 用心去搬砖,用脚修bug 一.初识 Package Control 首先, ...

  9. baserecyclerviewadapterhelper -- setOnItemChildClickListener出现的问题

    出现问题 使用baserecyclerviewadapterhelper 的时候使用 adapter.setOnItemChildClickListener()方法,点击没有反应. adapter.s ...

  10. [leetcode] 290. Word Pattern (easy)

    原题 思路: 建立两个哈希表,分别保存: 1 模式 :单词 2 单词 :是否出现过 水题 /** * @param {string} pattern * @param {string} str * @ ...