ES9 中的 for await...of 循环语句及注意事项
在 JavaScript 的新版本 ES9 中，引入了一个新的循环语句 for await...of，用于遍历异步迭代器的元素。在本文中，我们将详细介绍 for await...of 循环语句的用法、注意事项以及示例代码，帮助读者更好地理解和掌握这一新特性。
- for await...of 循环语句的用法
for await...of 循环语句的用法和 for...of 循环语句类似，都是用来遍历可迭代对象的元素。但是，for await...of 循环语句是专门用来遍历异步迭代器的元素，它可以自动处理异步操作，并在遍历到 Promise 对象时等待 Promise 对象的结果。
for await...of 循环语句的语法如下：
for await (let value of asyncIterable) {
// statements
}其中，asyncIterable 表示一个异步迭代器对象，value 表示异步迭代器中的每个元素。在循环体中，我们可以对每个元素进行操作，包括执行异步操作、处理 Promise 对象等。
- for await...of 循环语句的注意事项
在使用 for await...of 循环语句时，需要注意以下几点：
（1）异步迭代器必须实现 Symbol.asyncIterator 方法
异步迭代器必须实现 Symbol.asyncIterator 方法，用于返回一个异步迭代器对象。例如，下面的代码实现了一个异步迭代器对象 myAsyncIterable：
const myAsyncIterable = {
async *[Symbol.asyncIterator]() {
yield Promise.resolve(1);
yield Promise.resolve(2);
yield Promise.resolve(3);
}
};（2）异步迭代器中的元素必须是 Promise 对象
异步迭代器中的元素必须是 Promise 对象，否则会抛出异常。例如，下面的代码会抛出异常，因为元素不是 Promise 对象：
const myAsyncIterable = {
async *[Symbol.asyncIterator]() {
yield 1; // 报错：TypeError: 1 is not a promise
yield Promise.resolve(2);
yield Promise.resolve(3);
}
};（3）for await...of 循环语句必须在异步函数中使用
for await...of 循环语句必须在异步函数中使用，否则会抛出异常。例如，下面的代码会抛出异常，因为没有使用异步函数：
for await (let value of myAsyncIterable) {
console.log(value);
} // 报错：SyntaxError: await is only valid in async function（4）使用 break 或 return 可以提前结束循环
在 for await...of 循环语句中，可以使用 break 或 return 语句提前结束循环。例如，下面的代码使用 break 语句提前结束循环：
-- -------------------- ---- -------
----- -------- ------ -
----- --------------- - -
----- ------------------------- -
----- -------------------
----- -------------------
----- -------------------
-
--
--- ----- ---- ----- -- ---------------- -
-------------------
-- ------ --- -- -
------
-
-
-
------- -- ---- -- for await...of 循环语句的示例代码
下面是一个完整的示例代码，演示了如何使用 for await...of 循环语句遍历异步迭代器中的元素：
-- -------------------- ---- -------
----- -------- ------ -
----- --------------- - -
----- ------------------------- -
----- -------------------
----- -------------------
----- -------------------
-
--
--- ----- ---- ----- -- ---------------- -
-------------------
-
-
------- -- ---- - -在上面的代码中，我们定义了一个异步迭代器 myAsyncIterable，其中的元素都是 Promise 对象。然后，我们使用 for await...of 循环语句遍历异步迭代器中的元素，并在循环体中打印每个元素的值。最终，输出的结果是 1、2、3。
总结
在本文中，我们介绍了 ES9 中的 for await...of 循环语句的用法、注意事项以及示例代码。这一新特性可以帮助开发者更方便地处理异步操作，并提高代码的可读性和可维护性。希望读者通过本文的学习和实践，能够更好地掌握 for await...of 循环语句的使用方法，并在实际开发中灵活运用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6628ca5ac9431a720c5f9c54