前言
在前端开发中，我们经常需要处理异步操作。在处理异步操作时，我们需要用到迭代器（Iterator）、生成器（Generator）和异步可迭代对象（AsyncIterable）。在 ES9 中，还新增了异步迭代器（AsyncIterator）的概念。本文将会从 Iterator、Generator、AsyncIterable 到 ES9 的 Asynchronous Iterators 进行详细的介绍和学习，同时也会提供一些指导意义和示例代码。
迭代器（Iterator）
迭代器是一种可以遍历集合的对象。它提供了一种统一的访问集合中每个元素的方式，而无需暴露集合的内部结构。迭代器有两个方法：next() 和 return()。其中，next() 方法会返回一个对象，该对象包含两个属性：value 和 done。value 属性表示当前迭代到的元素，而 done 属性表示迭代是否已经完成。当迭代完成后，next() 方法会返回一个 done 属性为 true 的对象。
下面是一个迭代器的示例代码：
-------- ------------------- -
--- ----- - --
------ -
------ -
-- ------ - ----------- -
------ - ------ ------------- ----- ----- --
- ---- -
------ - ------ ---------- ----- ---- --
-
--
-------- -
--------------------- --- ---- ----------
------ - ------ ---------- ----- ---- --
-
--
-
----- -------- - -------------------- ---- ------
----------------------------- -- - ------ ---- ----- ----- -
----------------------------- -- - ------ ---- ----- ----- -
----------------------------- -- - ------ ---- ----- ----- -
----------------------------- -- - ------ ---------- ----- ---- -
------------------------------- -- -------- --- ---- ------- - ------ ---------- ----- ---- -生成器（Generator）
生成器是一种可以暂停和恢复执行的函数。生成器函数使用 function* 声明，它的执行过程可以被暂停和恢复，从而可以在函数的执行过程中生成多个值。生成器函数内部使用 yield 关键字来产生值，每次 yield 关键字会暂停函数的执行，并将产生的值返回给调用方。当再次调用生成器函数时，函数会从上次暂停的地方继续执行，直到函数执行结束或者遇到新的 yield 关键字。
下面是一个生成器的示例代码：
--------- ----------------- - ----- ---- ----- ---- ----- ---- - ----- --------- - ------------------ ------------------------------ -- - ------ ---- ----- ----- - ------------------------------ -- - ------ ---- ----- ----- - ------------------------------ -- - ------ ---- ----- ----- - ------------------------------ -- - ------ ---------- ----- ---- -
异步可迭代对象（AsyncIterable）
异步可迭代对象是一种可以异步遍历集合的对象。它提供了一种统一的访问集合中每个元素的方式，而无需暴露集合的内部结构。异步可迭代对象需要实现一个 Symbol.asyncIterator 方法，该方法会返回一个异步迭代器（AsyncIterator）。异步迭代器和迭代器的区别在于，异步迭代器的 next() 方法返回的是一个 Promise 对象，而不是一个对象。
下面是一个异步可迭代对象的示例代码：
----- --------- ------------------------ -
--- ---- - - -- - - ----------- ---- -
----- --- --------------- -- ------------------- -------
----- -------
-
-
----- ------------- - ------------------------- ---- ------
------ ---------- -
--- ----- ------ ----- -- -------------- -
-------------------
-
-----异步迭代器（AsyncIterator）
异步迭代器是一种可以异步遍历集合的迭代器。它需要实现一个 next() 方法，该方法返回一个 Promise 对象，该 Promise 对象会在异步操作完成后返回一个对象，该对象包含两个属性：value 和 done。value 属性表示当前迭代到的元素，而 done 属性表示迭代是否已经完成。当迭代完成后，next() 方法会返回一个 done 属性为 true 的对象。
下面是一个异步迭代器的示例代码：
----- ----- - -- -- --- --------------- -- ------------------- -----
----- --------- ------------------------ -
--- ---- - - -- - - ----------- ---- -
----- ------------
----- -------
-
-
----- ------------- - ------------------------- ---- ------
------ ---------- -
----------------- ---------------------- -- - ------ ---- ----- ----- -
----------------- ---------------------- -- - ------ ---- ----- ----- -
----------------- ---------------------- -- - ------ ---- ----- ----- -
----------------- ---------------------- -- - ------ ---------- ----- ---- -
-----ES9 的 Asynchronous Iterators
在 ES9 中，新增了异步迭代器（AsyncIterator）的概念，它是一种可以异步遍历集合的迭代器。ES9 中为异步迭代器新增了一个 Symbol.asyncIterator 方法，该方法会返回一个异步迭代器（AsyncIterator）。同时，ES9 中也为 for await...of 循环语句新增了支持，可以用来异步遍历异步可迭代对象（AsyncIterable）。
下面是一个 ES9 的 Asynchronous Iterators 的示例代码：
----- ----- - -- -- --- --------------- -- ------------------- -----
----- ------------- - -
----- ------------------------- -
----- ----
----- ------------
----- ----
----- ------------
----- ----
-
--
------ ---------- -
--- ----- ------ ----- -- -------------- -
-------------------
-
-----总结
本文从 Iterator、Generator、AsyncIterable 到 ES9 的 Asynchronous Iterators 进行了详细的介绍和学习，并提供了一些指导意义和示例代码。希望本文能够帮助读者更好地理解和应用这些概念，在实际开发中更加得心应手。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/6632e918d3423812e4076baf