在 ES6 中，for…of 循环是一个非常强大的语言特性，它可以用于遍历任何可迭代的对象，例如数组、字符串、Map、Set 等。在这篇文章中，我们将探讨 for…of 循环的使用场景，以及如何在实践中使用它。
for…of 循环的基本语法
for…of 循环的基本语法如下：
--- ---- ---- -- --------- - -- --- -
其中，item 表示每次循环中迭代的值，iterable 表示可迭代的对象。在循环过程中，item 会依次取到 iterable 中的每个值，直到循环结束。
下面是一个简单的示例，展示了如何使用 for…of 循环遍历数组：
----- --- - --- -- --- --- ---- ---- -- ---- - ------------------ - -- --- -- - -- - -- -
for…of 循环的使用场景
for…of 循环可以被用于任何可迭代的对象，包括数组、字符串、Map、Set 等。它的使用场景非常广泛，下面我们来看几个常见的使用场景。
遍历数组
遍历数组是 for…of 循环最常见的使用场景之一。它比传统的 for 循环更加简洁、易读。
----- --- - --- -- --- --- ---- ---- -- ---- - ------------------ - -- --- -- - -- - -- -
遍历字符串
for…of 循环可以用于遍历字符串。在遍历字符串时，item 会依次取到字符串中的每个字符。
----- --- - -------- --- ---- ---- -- ---- - ------------------ - -- --- -- - -- - -- - -- - -- -
遍历 Map
for…of 循环可以用于遍历 Map。在遍历 Map 时，item 会依次取到 Map 中的每个键值对。
----- --- - --- ----- -------- ------ ------- ---- --- --- ---- ----- ------ -- ---- - -------------------- ----------- - -- --- -- ----- -- -- ---- --
遍历 Set
for…of 循环可以用于遍历 Set。在遍历 Set 时，item 会依次取到 Set 中的每个值。
----- --- - --- ------- -- ---- --- ---- ---- -- ---- - ------------------ - -- --- -- - -- - -- -
for…of 循环的注意事项
在使用 for…of 循环时，需要注意以下几点：
不能遍历普通对象
for…of 循环只能用于遍历可迭代的对象，例如数组、字符串、Map、Set 等。不能用于遍历普通对象。
----- --- - - ----- ----- ---- -- -- --- ---- ---- -- ---- - -- ------ -- --- -------- ------------------ -
不能在循环过程中修改数组
在使用 for…of 循环遍历数组时，不能在循环过程中修改数组，否则会产生意想不到的结果。
----- --- - --- -- --- --- ---- ---- -- ---- - ---------- -- ----- - ----------------- -- -- ---
可以使用 break 和 continue
for…of 循环支持使用 break 和 continue 控制循环流程。
----- --- - --- -- ---
--- ---- ---- -- ---- -
-- ----- --- -- -
---------
-
------------------
-- ----- --- -- -
------
-
-
-- ---
-- -
-- -实践：使用 for…of 循环实现数组去重
我们可以使用 for…of 循环实现一个数组去重的函数。具体步骤如下：
- 定义一个空数组 result，用于存储去重后的结果。
- 遍历原数组 arr，对于每个值，判断是否已经存在于 result 中，如果不存在，则将其添加到 result 中。
- 返回 result。
-------- ----------- -
----- ------ - ---
--- ---- ---- -- ---- -
-- ------------------------ -
------------------
-
-
------ -------
-
----- --- - --- -- -- -- ---
------------------------- -- -- --- -- --总结
for…of 循环是一个非常强大的语言特性，它可以用于遍历任何可迭代的对象。在实践中，我们可以使用 for…of 循环简化代码，提高代码的可读性和可维护性。在使用 for…of 循环时，需要注意遵守其使用规范，避免出现意想不到的错误。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65f3b5d42b3ccec22fc261f9