在前端开发中，异步操作是非常常见的。ES9 中的 for-await-of 循环是一种新的语法，用于迭代异步数据，可以更加方便地处理异步操作。
什么是 for-await-of 循环
ES9 中的 for-await-of 循环是一种新的语法，它可以用于迭代异步数据。它的语法类似于 for-of 循环，但是可以处理异步数据。for-await-of 循环可以迭代任何实现了异步迭代器接口的对象。
异步迭代器接口
异步迭代器接口是一种新的接口，它定义了异步迭代器的行为。异步迭代器接口包含一个 next 方法，该方法返回一个 Promise 对象，该 Promise 对象的 resolve 值应该是一个包含 value 和 done 属性的对象。value 属性是一个迭代器返回的值，done 属性表示迭代器是否已经完成。
-- -------------------- ---- ------- ----- --------- ---------------- - ----- -- ----- -- ----- -- - ----- ------------- - ----------------- --------------------------------------------------------------- -- - ------ -- ----- ----- -
上面的代码定义了一个异步生成器函数 asyncGenerator，它返回一个异步迭代器对象。该对象实现了异步迭代器接口，并可以通过调用 [Symbol.asyncIterator] 方法获取异步迭代器。
使用 for-await-of 循环迭代异步数据
使用 for-await-of 循环迭代异步数据非常简单，只需要将异步迭代器对象传递给 for-await-of 循环即可。在循环体中，我们可以使用 await 关键字来等待异步操作的完成。
-- -------------------- ---- -------
----- --------- ---------------- -
----- -------------------
----- -------------------
----- -------------------
-
----- -------- ------ -
--- ----- ------ ----- -- ----------------- -
-------------------
-
-
------- -- -- -- -上面的代码定义了一个异步生成器函数 asyncGenerator，它返回一个异步迭代器对象。在 test 函数中，我们使用 for-await-of 循环迭代异步迭代器对象，并使用 await 关键字等待异步操作的完成。
示例代码
下面是一个完整的示例代码，它演示了如何使用 for-await-of 循环迭代异步数据。
-- -------------------- ---- -------
----- --------- ---------------- -
----- -------------------
----- -------------------
----- -------------------
-
----- -------- ------ -
--- ----- ------ ----- -- ----------------- -
-------------------
-
-
------- -- -- -- -总结
ES9 中的 for-await-of 循环是一种新的语法，用于迭代异步数据。它可以更加方便地处理异步操作。使用 for-await-of 循环迭代异步数据非常简单，只需要将异步迭代器对象传递给 for-await-of 循环即可。在循环体中，我们可以使用 await 关键字来等待异步操作的完成。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/660d2125d10417a222d86f8c