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会有不少帮助,比如数组这块, ...
随机推荐
- POI导出PPT
1.null <!-- https://mvnrepository.com/artifact/org.apache.poi/poi --> <dependency> <g ...
- 141.内置上下文处理器debug、request、auth、messages、media、static、csrf
上下文处理器 上下文处理器可以返回一些数据,在全局模板中都可以使用,比如登录后的用户数据,在很多页面中都需要使用,那么我们就可以方在上下文处理器中,就没有必要在每个视图中返回这个对象了. 在setti ...
- springboot~gradle4.7之后的lombok引用方法
在gradle4.7以后对于加入依赖lombok方式发生变化,gradle4.7版本以前,可以直接如下引用: compile("org.projectlombok:lombok:1.18.2 ...
- mysql日期函数及重复数据的查询
-- 日期函数select CURRENT_DATE,CURRENT_TIME,CURRENT_TIMESTAMP,year(CURRENT_DATE),month(CURRENT_DATE);sel ...
- WPF-命令-基础知识
命令模型的主要元素: 1.命令 2.命令绑定:命令连接到相关的应用程序逻辑 3.命令源:命令源触发命令, 4.命令目标:应用程序逻辑. -------------------------------- ...
- linux安装samba服务器
1- samba介绍 Samba 是在 Linux 和 UNIX 系统上实现 SMB 协议的一个免费软 件,由服务器及客户端程序构成,SMB(Server Messages Block,信息服务块)是 ...
- 如何通过注解方式给项目添加Swagger功能
在Java后端,每次开发一个新的接口后需要自测,此时可以借助Swagger功能很好地完成自测,下面将通过注解的方式来添加Swagger. (1)代码部分 package com.bien.edge; ...
- itchat 爬了爬自己的微信通讯录
参考 一件有趣的事: 爬了爬自己的微信朋友 忘记从谁那里看到的了,俺也来试试 首先在annconda prompt里面安装了itchat包 pip install itchat 目前对python这里 ...
- Help Jimmy POJ - 1661 dp
#include<iostream> #include<stdio.h> #include<algorithm> #include<cstring> u ...
- Wannafly Camp 2020 Day 7K 修炼
搞了半天才发现TMD是个模拟 #include <bits/stdc++.h> using namespace std; #define int long long int x,y,p,q ...