随着前端应用程序的复杂性不断增加，异步编程变得越来越重要。在 JavaScript 中，异步编程的一种常见方式是使用 Promise 和 async/await。然而，对于需要迭代异步数据的情况，ES9 标准引入了异步迭代器和 for-await-of 这两个新功能，以便更轻松地处理这些数据。
异步迭代器
异步迭代器是一个对象，它实现了一个异步迭代器协议。该协议定义了一个 next 方法，该方法返回一个 Promise，该 Promise 将解析为一个包含 done 和 value 属性的对象。done 属性表示是否还有更多的值可供迭代，而 value 属性则表示当前的值。
以下是一个简单的异步迭代器示例，它返回一个 Promise，该 Promise 将解析为 1、2 和 3：
-- -------------------- ---- -------
----- ------------- - -
------------------------ -
--- - - --
------ -
----- ------ -
-- -- - -- -
------ - ------ ---- ----- ----- --
-
------ - ----- ---- --
-
--
-
--
------ ---------- -
--- ----- ------ --- -- -------------- -
-----------------
-
-----
-- -------
-- -
-- -
-- -在上面的示例中，我们定义了一个异步迭代器 asyncIterable，它实现了 Symbol.asyncIterator 方法并返回一个具有 next 方法的对象。该 next 方法返回一个 Promise，该 Promise 将解析为包含 done 和 value 属性的对象。在 for-await-of 循环中，我们使用该异步迭代器迭代值，并将其打印到控制台中。
for-await-of
for-await-of 是一个新的循环语句，它允许我们迭代异步数据。它的语法与 for-of 循环相似，但是它可以迭代异步迭代器返回的 Promise。
以下是一个使用 for-await-of 的简单示例，它迭代一个异步数组并将其打印到控制台中：
-- -------------------- ---- -------
----- ---------- - -
----- ------------------------- -
----- ----- --- --------------- -- ------------- -- ----------- -------
----- ----- --- --------------- -- ------------- -- ----------- -------
----- ----- --- --------------- -- ------------- -- ----------- -------
-
--
------ ---------- -
--- ----- ------ --- -- ----------- -
-----------------
-
-----
-- -------
-- - ------ - -------
-- - ------ ------- -------
-- - ------ ------- -------在上面的示例中，我们定义了一个异步数组 asyncArray，它实现了 Symbol.asyncIterator 方法并使用 async 和 yield 关键字返回一个 Promise。在 for-await-of 循环中，我们使用该异步数组迭代值，并将其打印到控制台中。
总结
ES9 标准引入了异步迭代器和 for-await-of，以便更轻松地处理需要迭代异步数据的情况。异步迭代器是一个对象，它实现了一个异步迭代器协议，并定义了一个 next 方法，该方法返回一个 Promise，该 Promise 将解析为一个包含 done 和 value 属性的对象。for-await-of 是一个新的循环语句，它允许我们迭代异步数据。它的语法与 for-of 循环相似，但是它可以迭代异步迭代器返回的 Promise。
通过使用异步迭代器和 for-await-of，我们可以更轻松地处理异步数据，并编写更具可读性和可维护性的代码。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65e297e51886fbafa4f40be6