全国旗舰校区

不同学习城市 同样授课品质

北京

深圳

上海

广州

郑州

大连

武汉

成都

西安

杭州

青岛

重庆

长沙

哈尔滨

南京

太原

沈阳

合肥

贵阳

济南

下一个校区
就在你家门口
+
当前位置:首页  >  技术干货

JavaScript 的 for…in、for…of和forEach有什么区别?

发布时间:2023-10-14 21:28:50
发布人:xqq

一、遍历对象和数组

for…in:用于遍历对象的可枚举属性,无法直接遍历数组。for…of:用于遍历可迭代对象,包括数组、字符串、Set、Map等,无法直接遍历普通对象。forEach:只能用于遍历数组,不能用于遍历对象。

二、遍历顺序

for…in:遍历对象属性时,顺序不确定,取决于JavaScript引擎实现。for…of:遍历数组元素时,按照元素在数组中的顺序进行遍历。forEach:按照数组中元素的顺序依次遍历,不会跳过任何元素。

三、遍历的内容

for…in:遍历的是对象的属性名(键)。for…of:遍历的是可迭代对象的元素值。forEach:遍历的是数组的元素值。

四、可用性

for…in:可以用于遍历普通对象的可枚举属性,也可以用于遍历数组的索引。for…of:可以用于遍历具有迭代器的可迭代对象,如数组、字符串、Set、Map等。forEach:只能用于遍历数组,不支持遍历普通对象。

五、使用场景

for…in:适用于遍历对象的属性,在需要遍历对象的属性名或键时使用。for…of:适用于遍历可迭代对象的元素值,在需要遍历数组、字符串等可迭代对象的元素时使用。forEach:适用于遍历数组的元素值,在需要遍历数组并对每个元素执行相同操作时使用。

六、支持性

for…in:在所有现代浏览器中均支持。for…of:在较新版本的浏览器中支持,不支持旧版本的Internet Explorer(IE)浏览器。forEach:在较新版本的浏览器中支持,不支持旧版本的Internet Explorer(IE)浏览器。

七、使用方式

for…in:使用for…in循环时,需要使用hasOwnProperty()方法过滤原型链上的属性,以确保只遍历对象本身的属性。for…of:直接遍历可迭代对象的元素值,不需要额外的过滤操作。forEach:使用forEach方法时,需要传入一个回调函数作为参数,该函数会在每个数组元素上调用一次,执行特定的操作。

八、迭代器支持

for…in:不支持遍历迭代器对象。for…of:支持遍历具有迭代器的可迭代对象,可以遍历类似数组的自定义对象。forEach:不支持直接遍历迭代器对象,需要先将迭代器转换为数组再进行遍历。

延伸阅读

forEach方法

forEach 是一种常见的数组方法,用于对数组的每个元素执行指定的操作或回调函数。forEach 方法接受一个回调函数作为参数,并在数组的每个元素上调用该函数。回调函数可以接受三个参数:当前元素的值、当前元素的索引和正在遍历的数组本身。

下面是一个使用 forEach 方法的示例:

const numbers = [1, 2, 3, 4, 5];numbers.forEach((number, index, array) => {  console.log(当前元素:${number});  console.log(当前索引:${index});  console.log(当前数组:${array});});

在这个例子中,我们定义了一个名为 numbers 的数组,并对其应用 forEach 方法。回调函数中的参数 number 表示当前元素的值,index 表示当前元素的索引,array 表示正在遍历的数组。

在回调函数中,我们可以执行任意操作。在示例中,我们简单地将当前元素、索引和数组打印到控制台。

forEach 方法对于遍历数组并对每个元素执行相同的操作非常有用。然而,它不会返回新的数组,也不能在遍历过程中中止或跳过循环。如果需要返回新的数组或具有更多控制权的遍历操作,可以考虑使用其他数组方法,如 map、filter 或 reduce。

#it技术干货

相关文章

Go和Rust的高并发编程中,为什么要特别注意对齐?

Go和Rust的高并发编程中,为什么要特别注意对齐?

2023-10-14
基于SystemVerilog和基于verilog的验证平台有什么不同?

基于SystemVerilog和基于verilog的验证平台有什么不同?

2023-10-14
SQL子查询总结:相关子查询与非相关子查询有什么区别?

SQL子查询总结:相关子查询与非相关子查询有什么区别?

2023-10-14
在浏览器地址栏输入URL,按下回车后究竟发生了什么??

在浏览器地址栏输入URL,按下回车后究竟发生了什么??

2023-10-14

最新文章

常见网络安全面试题:Windows常用的命令有哪些?

常见网络安全面试题:Windows常用的命令有哪些?

2023-10-09
常见网络安全面试题:根据设备告警如何展开排查?

常见网络安全面试题:根据设备告警如何展开排查?

2023-10-09
常见网络安全面试题:mysql加固呢?(数据库加固)

常见网络安全面试题:mysql加固呢?(数据库加固)

2023-10-09
常见网络安全面试题:windows和linux加固?(操作系统加固)

常见网络安全面试题:windows和linux加固?(操作系统加固)

2023-10-09
在线咨询 免费试学 教程领取