JavaScript 是一门高度动态的编程语言，它的异步编程模型已经成为前端开发的标准。在 JavaScript 中，我们通常使用 Promise 和 async/await 等方法来处理异步操作。而在 ECMAScript 2018 中，JavaScript 引入了新的异步迭代器和 for-await-of 解决方案，使异步编程模型更加简洁和可读。
异步迭代器
异步迭代器是指一种能够异步遍历数据集合的迭代器。在 JavaScript 中，我们通常使用 for...of 循环来遍历数组、Map、Set 等数据结构。但是，这些数据结构都是同步的，无法处理异步操作。而异步迭代器则是为了解决这个问题而生的。
异步迭代器的实现需要实现一个名为 Symbol.asyncIterator 的方法。该方法返回一个异步迭代器对象，该对象具有一个名为 next 的方法，该方法返回一个 Promise 对象，表示下一个值的结果。
下面是一个异步迭代器的示例代码：
-- -------------------- ---- -------
----- ------------- - -
------------------------ -
--- - - --
------ -
----- ------ -
-- -- - -- -
------ - ------ ---- ----- ----- --
- ---- -
------ - ----- ---- --
-
-
--
-
--
------ ---------- -
--- ----- ------ --- -- -------------- -
-----------------
-
-----在上面的示例代码中，我们定义了一个名为 asyncIterable 的对象，该对象实现了 Symbol.asyncIterator 方法，返回了一个异步迭代器对象。该异步迭代器对象具有一个 next 方法，每次调用该方法返回一个 Promise 对象。在 for await...of 循环中，我们使用了 async/await 语法，将异步操作转换成了同步操作，使代码更加易读。
for-await-of 解决方案
在 ECMAScript 2017 中，JavaScript 引入了 for-await-of 循环，使我们能够使用异步迭代器遍历异步数据集合。for-await-of 循环的语法与 for...of 循环类似，但是它可以遍历异步迭代器返回的 Promise 对象。
下面是一个 for-await-of 循环的示例代码：
-- -------------------- ---- -------
----- -------- ----------- -
----- ------------- - -
------------------------ -
--- - - --
------ -
----- ------ -
-- -- - -- -
------ - ------ --------------------- ----- ----- --
- ---- -
------ - ----- ---- --
-
-
--
-
--
--- ----- ------ --- -- -------------- -
-----------------
-
-
------------在上面的示例代码中，我们定义了一个名为 asyncFunc 的异步函数，该函数中使用了 for-await-of 循环遍历了一个异步迭代器。在异步迭代器的 next 方法中，我们返回了一个 Promise 对象，表示下一个值的结果。在 for-await-of 循环中，我们使用了 async/await 语法，将异步操作转换成了同步操作，使代码更加易读。
总结
ECMAScript 2018 中引入的异步迭代器和 for-await-of 解决方案使 JavaScript 的异步编程模型更加简洁和可读。异步迭代器可以异步遍历数据集合，for-await-of 循环可以遍历异步迭代器返回的 Promise 对象。在实际开发中，我们可以使用异步迭代器和 for-await-of 循环来处理异步操作，使代码更加优雅和易读。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65d02cb9add4f0e0ff93824b