ES10 中引入了 for-await-of 循环，能够迭代异步生成器函数（Async Generator Function）产生的值。在这篇文章中，我们将讨论 for-await-of 循环的详细使用和适用场景，并提供示例代码和指导。
什么是异步生成器函数
异步生成器函数是一个 Async Function，用于生产一个异步迭代器。它通过 async 和 yield* 关键词来定义。以下是一个简单的例子：
async function* generate() {
yield* [1,2,3];
}这里的 generate() 函数将生成一个异步迭代器，它将按顺序生成 1、2、3。在这里，我们使用 yield* 语句将一个同步迭代器转换为异步迭代器。
for-await-of 的基本用法
for-await-of 循环可以通过迭代异步生成器函数产生的值，如下所示：
-- -------------------- ---- -------
----- --------- ---------- -
------ --------
-
----- -------- --------- -
--- ----- ---- --- -- ----------- -
-----------------
-
-
----------在这里，for-await-of 循环将按顺序迭代 generate() 函数中的值：1、2和3。这里使用了 async 函数和 await 关键字来等待异步操作的完成。
使用场景
for-await-of 循环的实际用途是迭代权威的异步数据源。以下是针对不同类型的异步数据源使用 for-await-of 循环的几个示例：
1. 迭代异步生成器函数
我们可以将异步生成器函数的返回值传递给 for-await-of 循环，以异步方式迭代产生的值。举个例子，假设我们从某个 API 调用中获得了一个异步数据源，并希望将其异步迭代：
-- -------------------- ---- -------
----- --------- ------------ -
----- --- - -----------------------------
----- -------- - ----- -----------
----- ----- - ----- ----------------
------ ------
-
----- -------- --------- -
--- ----- ---- ---- -- ------------- -
------------------
-
-在这个示例中，我们通过异步调用 fetch() 获取了一个 JSON 数据源， 将其转换为 item 数组， 然后使用 yield* 语句将其作为 Async Generator Function 的输出。使用 for-await-of 循环来异步迭代并打印每个 item。
2. 迭代异步迭代器
我们也可以使用 for-await-of 循环来迭代任何类似于数组、映射或集合的异步迭代器。举个例子，假设我们从某个数据库查询中获得了一个异步数据源，并希望将其异步迭代：
-- -------------------- ---- -------
----- -------- ------------ -
----- -- - ----- ---------------
----- ------ - ----- ---------------- - ---- --------
------ -------
-
----- -------- --------- -
----- ------- - ----- -------------
--- ----- ---- ---- -- -------- -
------------------
-
-在这个示例中，我们使用 openDatabase() 函数异步打开了一个数据库连接并从中获得了用户数据。将结果传递给 for-await-of 循环以异步迭代每个用户，并打印每个结果。
3. 迭代异步可迭代对象
最后，我们可以使用 for-await-of 循环来迭代异步可迭代对象，如文件读取器。
-- -------------------- ---- -------
----- -------- --------- -
----- ---------- - --------------------------------
----- -- - --------------------------
------ -----------
---------- --------
---
--- ----- ------ ---- -- --- -
------------------
-
-在这个示例中，我们使用 fileStream 构造器来异步打开一个文件，使用 readline.createInterface() 将其转换为可迭代的对象，然后使用 for-await-of 循环来读取每行数据并将其打印到控制台中。
结论
for-await-of 循环使我们能够异步地迭代异步数据源，使其更具可读性和可维护性。它是异步编程的强大工具和 ES10 语言功能。在你的下个异步项目中，强烈建议将 for-await-of 循环作为异步数据源的首选迭代方法。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6717228fad1e889fe2201921