前言
ES9 异步迭代器和生成器作为 ECMAScript 2018 的新增特性，有助于解决异步编程中的复杂性和回调地狱的问题，同时也为前端开发者提供了更加高效的解决方案。本篇文章将对 ES9 异步迭代器和生成器进行详细介绍，并提供相关示例代码和指导意义，希望对读者能够有所帮助。
什么是异步迭代器和生成器？
在介绍异步迭代器和生成器之前，我们先来了解一下迭代器和生成器。迭代器（Iterator）是一个对象，它具有 next() 方法，每次调用 next() 方法时，返回一个包含 value 和 done 两个属性的对象。done 表示迭代器是否已经结束，value 表示当前位置的值。
生成器（Generator）是一种特殊的函数，可以在函数内部使用 yield 表达式来暂停和恢复函数的执行。当函数执行到 yield 表达式时，会暂停执行并返回 yield 后面的值，直到下一次调用 next() 方法时，才会从上一次暂停的位置继续执行。
异步迭代器和生成器是在迭代器和生成器的基础上进行扩展的。异步迭代器是一个具有 next() 方法的对象，每次调用 next() 方法时可以返回一个 Promise 对象，并且在 Promise 对象 resolve 后，返回包含 value 和 done 两个属性的对象。异步生成器是一种特殊的函数，可以在函数内部使用 yield* 表达式来暂停和恢复异步操作的执行。当函数执行到 yield* 表达式时，会暂停执行并返回一个 Promise 对象，直到 Promise 对象 resolve 后，才会从上一次暂停的位置继续执行。
如何使用异步迭代器和生成器？
异步迭代器
在使用异步迭代器时，我们可以先定义一个异步生成器，然后在异步迭代器中调用 next() 方法，每次获取一个异步操作结果。下面是一个示例代码：
-- -------------------- ---- -------
----- --------- ---------------- -
----- ----- --- --------------- -- ------------------- ----- ----
----- ----- --- --------------- -- ------------------- ----- ----
----- ----- --- --------------- -- ------------------- ----- ----
-
----- -------- ------ -
--- ----- ------ ----- -- ----------------- -
-------------------
-
-
------- -- - - -在上面的示例代码中，我们定义了一个异步生成器 asyncGenerator()，它依次返回三个 Promise 对象，并使用 yield 关键字暂停异步操作的执行。然后我们定义了一个 async 函数 main()，使用异步迭代器 for await...of 来循环获取异步操作结果，并将结果打印到控制台。
异步生成器
在使用异步生成器时，我们可以先定义一个异步操作，然后在异步生成器中使用 yield* 表达式调用异步操作，下面是一个示例代码：
-- -------------------- ---- -------
----- -------- -------------- -
------ --- --------------- -- -
------------- -- ------------- ------
---
-
----- --------- ---------------- -
----- ---- - ------------------------------------------------ ----------------------------------------------- ------------------------------------------------
--- ------ --- -- ----- -
----- ----- ---------------
-
-
----- -------- ------ -
--- ----- ------ ----- -- ----------------- -
-------------------
-
-
------- -- -------------------------------------------- -------------------------------------------- --------------------------------------------在上面的示例代码中，我们定义了一个异步操作 fetchData()，它模拟了一个网络请求并返回 Promise 对象。然后我们定义了一个异步生成器 asyncGenerator()，使用 yield* 表达式调用 fetchData()，并返回 Promise 对象。最后我们定义了一个 async 函数 main()，使用异步迭代器 for await...of 来循环获取异步操作结果，并将结果打印到控制台。
总结
ES9 异步迭代器和生成器作为 ECMAScript 2018 的新增特性，可以帮助我们更加高效地处理异步编程中的复杂性和回调地狱的问题。在使用异步迭代器和生成器时，我们需要注意异步操作的执行顺序，并使用 await 函数来等待异步操作的结果。希望本篇文章能够对读者有所帮助，并在实际开发中得到应用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64799e44968c7c53b059a90c