在 ES7 中，引入了一个新语法 Async Generator Function，它可以用来定义一个异步迭代器。但是在实际使用过程中，我们常常需要对异步迭代器进行遍历，并且处理它返回的异步值。而在 ES7 中，并没有提供对异步迭代器遍历的特定语法，这就导致我们必须手动编写复杂的异步逻辑来处理它们的值。
ES9 中，新增了一个 for-await-of 循环，它可以用来遍历异步迭代器，并自动处理异步值的返回。具体来说，for-await-of 循环会在每个循环迭代中自动调用异步迭代器返回值的 then 方法，并等待其完成后再进行下一次迭代。
为何需要 for-await-of 循环
在 ES7 中，我们可以这样定义一个异步迭代器：
async function* asyncGenerator() {
yield Promise.resolve(1);
yield Promise.resolve(2);
yield Promise.resolve(3);
}
const iter = asyncGenerator();
iter.next().then(console.log); // { value: 1, done: false }可以看到，异步迭代器返回的值是 Promise 对象，也就是说我们需要使用 .then() 来处理异步的返回值。而如果我们需要在循环中对异步迭代器进行处理，那么就需要使用类似下面的代码：
-- -------------------- ---- -------
----- -------- ------------------ -
----- ------ -
----- --- - ----- ------------
-- ---------- ------
----------------- -----------
-
-
----- ---- - -----------------
------------------- -- -- -- -上面的代码模拟了一个异步迭代器的遍历操作，并手动等待每个异步值的返回结果。但是随着异步逻辑的复杂度增加，这种做法会让代码变得难以维护和理解。
因此，在 ES9 中，我们可以使用 for-await-of 循环来遍历异步迭代器，并自动等待每个异步值的返回：
async function iterateAsync(iter) {
for await (const val of iter) {
console.log(val);
}
}
const iter = asyncGenerator();
iterateAsync(iter); // 1, 2, 3可以看到，使用 for-await-of 循环，我们可以更加轻松地遍历异步迭代器，并自动等待每个异步值的返回结果。
for-await-of 的使用
for-await-of 循环的使用方法和普通的 for-of 循环类似，只需要将迭代器对象作为循环的参数即可：
-- -------------------- ---- -------
----- --------- ---------------- -
----- -------------------
----- -------------------
----- -------------------
-
----- -------- ------------------ -
--- ----- ------ --- -- ----- -
-----------------
-
-
----- ---- - -----------------
------------------- -- -- -- -在实际开发中， for-await-of 循环常常用于遍历和处理异步流数据：
-- -------------------- ---- -------
----- -- - --------------
----- -------- - --------------------
----- --------- --------------------- -
----- -- - ----------------------------- - --------- ------- ---
----- -- - -------------------------- ------ -- ---
--- ----- ------ ---- -- --- -
----- ------------
-
-
----- -------- --------------------- -
--- --- - --
--- ----- ------ ---- -- ---------------------- -
------
-
----------------- ----------- --- ------ ---------
-
--------------------------可以看到，上面的代码使用了 for-await-of 循环来遍历文件的每一行，并统计文件中共有多少行。在代码中，我们直接使用了 Node.js 提供的 fs 和 readline 模块进行异步 IO 操作，而 for-await-of 循环帮助我们更加方便地对结果进行处理。
总结
ES9 中引入的 for-await-of 循环提供了一种更加简便的方式来处理异步迭代器的返回值。相比于手动编写异步逻辑，我们可以直接使用 for-await-of 循环来遍历异步迭代器，并处理其异步值的返回结果。在实际开发中， for-await-of 循环常常应用于处理异步流数据，进一步提高了异步编程的便利性和可读性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64cbb0955ad90b6d0421cd88