ECMAScript 2017：理解 for...of 循环
for...of 循环是 ECMAScript 6 中引入的一个新特性，它可以用来遍历可迭代对象中的元素。在 ECMAScript 2017 中，for...of 循环得到了进一步的改进。本文将详细介绍 for...of 循环的使用方法，以及在实际开发中的应用。
- for...of 循环的基本用法
for...of 循环的基本语法如下：
--- ---- ----- -- --------- - -- --- -
其中，iterable 表示可迭代对象，如数组、Set、Map 等。value 表示当前遍历到的元素的值。循环体中可以使用 value 来访问当前元素。
下面是一个简单的示例，演示如何使用 for...of 循环遍历数组：
----- --- - --- -- --- --- ---- ----- -- ---- - ------------------- -
输出结果为：
- - -
- for...of 循环的高级用法
除了基本用法之外，for...of 循环还有一些高级用法，可以更灵活地应用于实际开发中。下面分别介绍这些高级用法。
2.1. 在字符串中使用 for...of 循环
在 ECMAScript 6 中，字符串被视为可迭代对象。因此，可以使用 for...of 循环遍历字符串中的字符。下面是一个示例：
----- --- - -------- --- ---- ---- -- ---- - ------------------ -
输出结果为：
- - - - -
2.2. 在 Map 中使用 for...of 循环
在 ECMAScript 6 中，Map 被视为可迭代对象。因此，可以使用 for...of 循环遍历 Map 中的键值对。下面是一个示例：
----- --- - --- ------ --------------- ------- -------------- ---- --- ---- ----- ------ -- ---- - ---------------- ------- -
输出结果为：
---- --- --- --
2.3. 在 Set 中使用 for...of 循环
在 ECMAScript 6 中，Set 被视为可迭代对象。因此，可以使用 for...of 循环遍历 Set 中的元素。下面是一个示例：
----- --- - --- ------- -- ---- --- ---- ----- -- ---- - ------------------- -
输出结果为：
- - -
2.4. 在自定义对象中使用 for...of 循环
除了以上内置对象之外，我们也可以在自定义对象中使用 for...of 循环。为了实现这个功能，我们需要在自定义对象上实现一个名为 Symbol.iterator 的方法，该方法返回一个迭代器对象。下面是一个示例：
----- --- - -
----- --- -- ---
------------------- -
--- ----- - --
----- ---- - -----
------ -
------ -
-- ------ - ----------------- -
------ -
------ -------------------
----- -----
--
- ---- -
------ -
----- ----
--
-
-
--
-
--
--- ---- ----- -- ---- -
-------------------
-输出结果为：
- - -
- 总结
通过本文的介绍，我们了解了 for...of 循环的基本用法以及高级用法。在实际开发中，for...of 循环可以帮助我们更方便地遍历各种类型的可迭代对象，提高开发效率。同时，我们也可以通过实现 Symbol.iterator 方法来在自定义对象中使用 for...of 循环。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65df40271886fbafa4c7d305