前言
在 JavaScript 中，异步编程一直是一个非常重要的话题。随着 ES6 的发布，JavaScript 引入了 Promise 和 async/await 这两种新的异步编程方式，大大简化了异步编程的复杂度。但是，对于一些需要处理大量数据的场景，这些方式仍然存在一些问题。比如，当我们需要处理一个非常大的数组时，如果将其全部载入内存中，可能会引起性能问题。而在这种情况下，异步迭代器就可以派上用场了。
异步迭代器
异步迭代器是 ES2018 中引入的一个新特性。与传统的同步迭代器不同，异步迭代器可以在每次迭代时返回一个 Promise 对象，以异步处理数据的获取。
异步迭代器的基本结构如下：
----- --------- ---------------- - -- --- ----- ------ -- --- -
可以看到，异步迭代器的定义与同步迭代器有些类似，只是在函数前面加上了 async 关键字，并在函数体中使用了 yield 关键字。其中，yield 关键字返回一个 Promise 对象，用于异步获取数据。
异步迭代器的使用
在使用异步迭代器时，我们可以通过 for await...of 循环来进行遍历，例如：
----- --------- ---------------- -
----- -------------------
----- -------------------
----- -------------------
-
------ ---------- -
--- ----- ------ ----- -- ----------------- -
-------------------
-
-----上面的代码中，我们定义了一个异步迭代器 asyncGenerator()，它会依次返回三个 Promise 对象。然后，我们使用 for await...of 循环来遍历这个异步迭代器，并打印每个 Promise 对象的值。
需要注意的是，由于异步迭代器返回的是 Promise 对象，因此在使用 for await...of 循环时，需要使用 await 关键字来等待 Promise 对象的结果。
异步迭代器的示例
下面，我们来看一个更加实际的例子。假设我们有一个非常大的数组，它包含了 1000 个元素。我们希望能够使用异步迭代器来遍历这个数组，并在遍历时进行一些异步处理。
----- --- - --- -------------------------- -- -- ---
----- --------- ---------------- -
--- ------ ---- -- ---- -
----- --- --------------- -- ------------------- ------
----- -----
-
-
------ ---------- -
--- ----- ------ ----- -- ----------------- -
-------------------
-
-----上面的代码中，我们定义了一个长度为 1000 的数组 arr，并使用 Array.fill() 和 Array.map() 方法来填充数组元素。然后，我们定义了一个异步迭代器，它会遍历这个数组，并在每个元素上进行异步处理，这里我们使用了 setTimeout() 来模拟异步处理的过程。最后，我们使用 for await...of 循环来遍历这个异步迭代器，并打印每个元素的值。
总结
异步迭代器是 ES12 中的一个新特性，它可以在每次迭代时返回一个 Promise 对象，以异步处理数据的获取。使用异步迭代器可以避免一次性将大量数据全部载入内存中，从而提高程序的性能。在实际应用中，我们可以使用 for await...of 循环来遍历异步迭代器，并在遍历时进行一些异步处理。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65d2f237add4f0e0ffb387c3