在现代 Web 开发中，异步编程几乎已成为必备技能。JavaScript 等语言也不断迭代开发创新，推出各种新语法以更好地支持异步编程。ES9 引入了 for-await-of 方法就是其中之一。本文将深入浅出地讲解 ES9 中的 for-await-of 方法及其实践应用。
for-await-of 简介
for-await-of 方法可以迭代异步数据流中的数据，使其写起来更加简便轻松。以一个简单的例子作为说明：
-- -------------------- ---- -------
----- --------- ---------------- -
----- ----- -------------------
----- ----- -------------------
----- ----- -------------------
-
------ -- -- -
--- ----- ------ --- -- ----------------- -
-----------------
-
-----
-- ---
-- -
-- -
-- -可以看到，该示例中用 async function* 创建了一个异步生成器，里面用 yield 来返回异步值。for-await-of 方法迭代异步生成器中产生的值，包括异步操作。这样，我们就可以在不阻塞进程的情况下，异步地输出各个值了。
实践应用
读取一个大型 CSV 文件
现在我们有一个 5GB 大小的 CSV 文件需要处理，并将其导入数据库。在处理大型文件时，通常会将其分块进行处理。这里在处理过程中使用 for-await-of 方法。
-- -------------------- ---- -------
----- --- - ----------------------
----- -- - --------------
----- -------- ----------- -
----- ---------- - --------------------------------------
--------------------------------- ----- ------- -- -
----- ---------------- -- --------
---
-
------------在该示例中，我们使用 csv-parser 插件根据 \n 划分文件内容，并在数据事件处理程序上使用 saveToDB 方法来保存数据。
并行处理 Promise 集合
假设我们需要从外部请求 10 个 API 接口，并行地处理这些 Promise 集合。可以使用 Promise.all 方法，但是执行的过程是串行的，并不能真正地实现并行操作。
async function processRequests() {
const results = [];
const promises = [fetchData('https://api1'), fetchData('https://api2'), fetchData('https://api3')...]; // 伪代码
for await (const result of promises) {
results.push(result);
}
console.log(results); // 打印所有请求的结果
}在该示例中，我们使用 for-await-of 来并行处理 Promise 集合。只要 Promise 在一个集合里，并启用了 async iterator，就可以对它们执行并行操作。
链式串行操作
for-await-of 方法也可用于将多个操作连接起来，形成流式 API。这种模式通常用于流式数据库查询操作，就像 MongoDB 的 Aggregation Pipeline。来看下面例子：
-- -------------------- ---- -------
-------- ------------------------------ -
------ ---------------------- - ---
-
----- -------- ----------------------------- -
--- ---- - ---
--- -
--- ----- ------ --------- -- ----------- -
---- - ----- ----------------
-
------ -----
- ----- --- -
------ --
-
-
-------------------------------------- ----------------------- ------------------------------------------ -- -- --在该示例中，我们使用 for-await-of 依次操作 Promise 集合，将 Promise 的返回作为下一步的输入，从而形成链式操作，使其更加简单和流畅。
总结
for-await-of 方法简化了迭代异步数据流中的数据。它可以用于读取大型文件、并行处理 Promise 集合、链接流操作等操作。对于当前 Web 开发人员来说，了解并熟练使用这种新语法对于提高开发能力还是很有益处的。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64c1159683d39b488156ff1e