在 ECMAScript2015 中，新引入了一种循环语句：for-of 循环。与传统的 for 循环和 forEach 循环不同，for-of 循环具有更高效和更简洁的代码风格，且支持迭代器和生成器。
语法
for-of 循环的语法格式如下：
for (let item of iterable) {
// 循环体
}其中：
item：代表每一项迭代出的值，可以使用let或var声明一个变量来接收迭代出的值。iterable：代表需要迭代的对象，可以是数组、类数组、字符串、Map、Set、生成器等。
示例
以下是使用 for-of 循环遍历数组的示例：
let arr = [1, 2, 3];
for (let item of arr) {
console.log(item);
}
// 输出：1 2 3以下是使用 for-of 循环遍历字符串的示例：
let str = 'hello';
for (let char of str) {
console.log(char);
}
// 输出：h e l l o迭代器和生成器
for-of 循环可以迭代具有迭代器的对象。迭代器是一个对象，它具有一个 next() 方法，每次调用该方法都会返回一个包含 value 和 done 属性的对象，其中 value 代表当前迭代出的值，done 是一个布尔值，表示是否已遍历完成。
以下是一个具有迭代器的对象的示例：
-- -------------------- ---- -------
--- --- - -
----- --- -- ---
------------------- -
--- ----- - --
--- ---- - ----------
------ -
------ -
-- ------ - ------------ -
------ - ------ -------------- ----- ----- --
- ---- -
------ - ----- ---- --
-
-
--
-
--
--- ---- ---- -- ---- -
------------------
-
-- ---- - -for-of 循环还可以迭代生成器函数生成的值序列。生成器函数是一种特殊的函数，它使用 function* 关键字定义一个生成器，并使用 yield 关键字返回一个值。每次调用生成器函数时，它都会返回一个生成器对象，通过调用 next() 方法可以逐个返回由 yield 语句生成的值。
以下是一个使用生成器函数遍历斐波那契数列的示例：
-- -------------------- ---- -------
--------- ----------- -
--- - - -- - - --
----- ------ -
--- -- - --- - - ---
----- --
-
-
--- ---- --- -- ------------ -
-- ---- - ---- ------
-----------------
-
-- ---- - - - - - -- -- -- -- --注意事项
使用 for-of 循环有以下注意事项：
- for-of 循环只能遍历可迭代对象，不能遍历普通对象。
- for-of 循环是基于迭代器和生成器实现的，如果需要遍历一个普通对象，可以通过定义一个迭代器来实现。
- for-of 循环不支持 break 或 continue 语句中断循环，但支持 throw 语句抛出异常。
- for-of 循环不能直接修改迭代出的值，需要通过迭代器或生成器返回一个新值来实现修改。
总结
for-of 循环是 ECMAScript2015 中的一个新循环语句，它具有更高效、更简洁的代码风格，且支持迭代器和生成器。通过 for-of 循环可以遍历数组、类数组、字符串、Map、Set 等可迭代对象，也可以遍历迭代器和生成器生成的值序列。但需要注意的是，for-of 循环只能遍历可迭代对象，不能遍历普通对象，并且不支持 break 或 continue 语句中断循环。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64b0b4e848841e9894ccc077