首页 web前端 前端问答 es6中map和foreach有什么区别

es6中map和foreach有什么区别

Mar 09, 2022 pm 07:10 PM
es6 foreach map

区别:1、forEach()方法不会返回执行结果,返回值为“undefined”,而map()方法会返回运算结果,会返回一个数组;2、forEach()方法会修改原来的数组,而map()方法不会修改原来的数组。

es6中map和foreach有什么区别

本教程操作环境:windows7系统、ECMAScript 6版、Dell G3电脑。

foreEach()方法:针对每一个元素执行提供的函数。

map()方法:创建一个新的数组,其中每一个元素由调用数组中的每一个元素执行提供的函数得来。

区别

forEach()方法不会返回执行结果,而是undefined。也就是说,forEach()会修改原来的数组。而map()方法会得到一个新的数组并返回。

例子:

制作一个数组的平方

有如下一个数组

let arr =[1,2,3,4,5,6]
登录后复制

下面分别用forEach()和Map()

forEach()

注意,forEach是不会返回有意义的值的。

我们在回调函数中直接修改arr的值。

arr.forEach((value, key) => {
 return arr[key] = value * value;
});
登录后复制

执行结果如下:

1.png

Map()

let list = arr.map(value => {
 return value * value;
});
登录后复制

执行结果如下:

2.png

执行速度对比

forEach()的执行速度 < map()的执行速度

3.png

如何使用

forEach适合于你并不打算改变数据的时候,而只是想用数据做一些事情 – 比如存入数据库或则打印出来。

let arr = [&#39;a&#39;, &#39;b&#39;, &#39;c&#39;, &#39;d&#39;];
arr.forEach((letter) => {
 console.log(letter);
});
// a
// b
// c
// d
登录后复制

map()适用于你要改变数据值的时候。不仅仅在于它更快,而且返回一个新的数组。这样的优点在于你可以使用复合(composition)(map(), filter(), reduce()等组合使用)来玩出更多的花样。

let arr = [1, 2, 3, 4, 5];
let arr2 = arr.map(value => value * value).filter(value => value > 10);
// arr2 = [16, 25]
登录后复制

我们首先使用map将每一个元素乘以它们自身,然后紧接着筛选出那些大于10的元素。最终结果赋值给arr2。

总结

forEach()可以做到的东西,map()也同样可以。反过来也是如此。

map()会分配内存空间存储新数组并返回,forEach()不会返回数据。

forEach()允许callback更改原始数组的元素。map()返回新的数组。

【相关推荐:javascript视频教程web前端

以上是es6中map和foreach有什么区别的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热门文章

<🎜>:泡泡胶模拟器无穷大 - 如何获取和使用皇家钥匙
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
Mandragora:巫婆树的耳语 - 如何解锁抓钩
3 周前 By 尊渡假赌尊渡假赌尊渡假赌
北端:融合系统,解释
3 周前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

热门话题

Java教程
1668
14
CakePHP 教程
1426
52
Laravel 教程
1329
25
PHP教程
1273
29
C# 教程
1256
24
springboot怎么读取yml文件中的list列表、数组、map集合和对象 springboot怎么读取yml文件中的list列表、数组、map集合和对象 May 11, 2023 am 10:46 AM

application.yml定义list集合第一种方式使用@ConfigurationProperties注解获取list集合的所有值type:code:status:-200-300-400-500编写配置文件对应的实体类,这里需要注意的是,定义list集合,先定义一个配置类Bean,然后使用注解@ConfigurationProperties注解来获取list集合值,这里给大家讲解下相关注解的作用@Component将实体类交给Spring管理@ConfigurationPropertie

Java ArrayList遍历时使用foreach和iterator删除元素的区别是什么? Java ArrayList遍历时使用foreach和iterator删除元素的区别是什么? Apr 27, 2023 pm 03:40 PM

一、Iterator和foreach的区别多态差别(foreach底层就是Iterator)Iterator是一个接口类型,他不关心集合或者数组的类型;for和foreach都需要先知道集合的类型,甚至是集合内元素的类型;1.为啥说foreach底层就是Iterator编写的代码:反编译代码:二、foreach与iterator时remove的区别先来看阿里java开发手册但1的时候不会报错,2的时候就会报错(java.util.ConcurrentModificationException)首

php如何判断foreach循环到第几个 php如何判断foreach循环到第几个 Jul 10, 2023 pm 02:18 PM

​php判断foreach循环到第几个的步骤:1、创建一个“$fruits”的数组;2、创建一个计数器变量“$counter”初始值为0;3、使用“foreach”循环遍历数组,并在循环体中增加计数器变量的值,再输出每个元素和它们的索引;4、在“foreach”循环体外输出计数器变量的值,以确认循环到了第几个元素。

Java怎么设置过期时间的map Java怎么设置过期时间的map May 04, 2023 am 10:13 AM

一、技术背景在实际的项目开发中,我们经常会使用到缓存中间件(如redis、MemCache等)来帮助我们提高系统的可用性和健壮性。但是很多时候如果项目比较简单,就没有必要为了使用缓存而专门引入Redis等等中间件来加重系统的复杂性。那么Java本身有没有好用的轻量级的缓存组件呢。答案当然是有喽,而且方法不止一种。常见的解决方法有:ExpiringMap、LoadingCache及基于HashMap的封装三种。二、技术效果实现缓存的常见功能,如过时删除策略热点数据预热三、ExpiringMap3.

async是es6还是es7的 async是es6还是es7的 Jan 29, 2023 pm 05:36 PM

async是es7的。async和await是ES7中新增内容,是对于异步操作的解决方案;async/await可以说是co模块和生成器函数的语法糖,用更加清晰的语义解决js异步代码。async顾名思义是“异步”的意思,async用于声明一个函数是异步的;async和await有一个严格规定,两者都离不开对方,且await只能写在async函数中。

PHP返回一个键值翻转后的数组 PHP返回一个键值翻转后的数组 Mar 21, 2024 pm 02:10 PM

这篇文章将为大家详细讲解有关PHP返回一个键值翻转后的数组,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。PHP键值翻转数组键值翻转是一种对数组进行的操作,它将数组中的键和值进行交换,生成一个新的数组,其中原始键作为值,原始值作为键。实现方法在php中,可以通过以下方法对数组进行键值翻转:array_flip()函数:array_flip()函数专门用于键值翻转操作。它接收一个数组作为参数,并返回一个新的数组,其中键和值已交换。$original_array=[

Java中将对象与Map相互转换的实现方式 - 使用BeanMap Java中将对象与Map相互转换的实现方式 - 使用BeanMap May 08, 2023 pm 03:49 PM

javabean与map的转换有很多种方式,比如:1、通过ObjectMapper先将bean转换为json,再将json转换为map,但是这种方法比较绕,且效率很低,经测试,循环转换10000个bean,就需要12秒!!!不推荐使用2、通过Java反射,获取bean类的属性和值,再转换到map对应的键值对中,这种方法次之,但稍微有点麻烦3、通过net.sf.cglib.beans.BeanMap类中的方法,这种方式效率极高,它跟第二种方式的区别就是因为使用了缓存,初次创建bean时需要初始化,

优化Go语言map的性能 优化Go语言map的性能 Mar 23, 2024 pm 12:06 PM

优化Go语言map的性能在Go语言中,map是一种非常常用的数据结构,用来存储键值对的集合。然而,在处理大量数据时,map的性能可能受到影响。为了提高map的性能,我们可以采取一些优化措施来减少map操作的时间复杂度,从而提升程序的执行效率。1.预分配map的容量在创建map时,我们可以通过预分配容量来减少map扩容的次数,提高程序的性能。一般情况下,我们

See all articles