ECMAScript 2021 (ES12) 中的 for-in 循环与 for-of 循环的区别及其应用场景
在 ECMAScript 2021 中，新引入了 for-in 循环和 for-of 循环两种不同类型的循环。在本文中，我们将深入探讨这两种循环的区别以及它们各自的应用场景。
for-in 循环
for-in 循环用于遍历对象的可枚举属性。它的语法如下：
--- --------- -- ------- - -- ---- ----- -- -- -------- -
其中，variable 代表变量名，在循环过程中它将被赋值为当前属性名；而 object 则代表要遍历的对象。
然而，需要注意的是，由于 for-in 循环遍历对象的可枚举属性，因此在遍历中可能会出现以下情况：
- 遍历顺序不确定
- 遍历顺序可能会受到原型链的影响
- 可能会遍历到非自有属性
因此，我们在使用 for-in 循环时，需要考虑到这些情况，并针对具体情况进行处理。
以下是一个 for-in 循环的示例代码：
----- -------- - - -- -- -- -- -- - -- --- ---- ------------ -- --------- - ---------------------------- - ---------------------------- -
结果输出：
- - - - - - - - -
for-of 循环
for-of 循环用于遍历可迭代对象中的元素。它的语法如下：
--- --------- -- --------- - -- ---- ----- -- -- -------- -
其中，variable 代表变量名，在循环过程中它将被赋值为当前元素；而 iterable 则代表要遍历的可迭代对象。
需要注意的是，for-of 循环只能遍历实现了迭代协议的对象，比如 Array 和 String 等。
以下是一个 for-of 循环的示例代码：
----- ------- - --- -- --- --- ---- ------- -- -------- - --------------------- -
结果输出：
- - -
for-in 循环与 for-of 循环的应用场景
通过上面的介绍，我们已经了解了 for-in 循环和 for-of 循环的用法和语法。接下来，我们将分别介绍它们各自的应用场景。
for-in 循环
由于 for-in 循环遍历的是对象的可枚举属性，因此它适用于以下场景：
- 遍历对象的属性并进行处理
- 遍历对象的属性并获取属性名或属性值
以下是一个应用 for-in 循环遍历对象属性并输出属性名和属性值的示例代码：
----- -------- - - -- -- -- -- -- - -- --- ---- ------------ -- --------- - ---------------------- ---------------- ------ ---------------------------- -
结果输出：
--------- -- ------ - --------- -- ------ - --------- -- ------ -
for-of 循环
由于 for-of 循环遍历的是可迭代对象的元素，因此它适用于以下场景：
- 遍历数组并对每个元素进行处理
- 遍历字符串并对每个字符进行处理
以下是一个应用 for-of 循环遍历数组并输出数组元素的示例代码：
----- ------- - --- -- --- --- ---- ------- -- -------- - --------------------- -
结果输出：
- - -
总结
通过本文，我们介绍了 ECMAScript 2021 中 for-in 循环和 for-of 循环的语法、用法以及各自的应用场景。要注意的是，在使用这两种循环时，需要根据具体情况选择合适的循环类型，并注意循环中可能出现的情况，并针对具体情况进行处理。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/652ed66f7d4982a6ebfeef96