如何避免 ES9 的 Bug: 异步迭代器实践
ES9 引入了异步迭代器 (Async Iterator) 的概念，使得我们可以在可迭代对象中使用异步函数。但是，异步迭代器的实现并不容易，存在一些隐蔽的 Bug，本文将详细介绍如何避免这些 Bug，并给出示例代码以供参考。
异步迭代器的概念
异步迭代器可以理解为一个迭代器对象，它的 next() 方法返回一个 Promise 对象，当 Promise 对象 resolve 后，返回一个包含 value 和 done 两个属性的对象。
-- -------------------- ---- -------
----- ------------- - -
----------------------- ---------- -
------ -
-- --
----- ----- ---------- -
-- ------- - -- -
----- --- --------------- -- ------------------- -------
------ - ------ --------- ----- ----- --
-
------ - ----- ---- --
-
--
-
--在上面的示例中，我们定义了一个异步迭代器 asyncIterable，它是一个可迭代对象，其 [Symbol.asyncIterator] 属性返回一个包含 next() 方法的迭代器对象，这个 next() 方法是异步的，等待 1 秒后返回下一个值。
避免 Bug
异步迭代器存在一些 Bug，比如当我们使用 for-of 循环或者解构赋值时，容易遇到无限卡住或者 TypeError 的错误。
无限卡住
无限卡住的 Bug 是指当异步迭代器的 next() 方法返回 rejected 的 Promise 对象时，程序会卡在这里，无法继续执行下一步代码。这种情况可能是由于网络请求超时或者服务器崩溃等原因导致的。
为了避免这种情况，我们可以使用 Promise.race() 方法设置一个超时时间，当 next() 方法执行超时时，直接抛出一个 TimeoutError 异常。
-- -------------------- ---- -------
----- ------- - -- -- --- ----------------- ------- -- -
------------- -- ---------- ------------------ ---
---
--- ----- ------ ---- -- -------------- -
--- -
----- --- - ----- ------------------- ---------------
----------------
- ----- --- -
----------------
-
-TypeError
TypeError 的 Bug 是指当我们在解构赋值或者 for-of 循环中使用异步迭代器时，会报错 TypeError: item[Symbol.asyncIterator] is not a function 。
这是因为异步迭代器只有在实现了 Symbol.asyncIterator 方法之后才能正确解析，所以我们需要确保可迭代对象实现了 Symbol.asyncIterator 方法。
-- -------------------- ---- -------
----- ------------- - -
----------------------- -------- -- -
------ ----
--
----- ----- -------- -- -
----- --- --------------- -- ------------------- ------
------ - ------ ------ ------- ----- ---- -
-
-
----- ------ - ----- ----------------------------
-----------------在上面的示例中，我们为异步迭代器 asyncIterable 实现了 Symbol.asyncIterator 方法，将 this 对象作为返回值，确保解析 asyncIterable 时不会报错。
示例代码
-- -------------------- ---- -------
----- ------- - -- -- --- ----------------- ------- -- -
------------- -- ---------- ------------------ ---
---
----- ------------- - -
----------------------- ---------- -
------ -
-- --
----- ----- ---------- -
-- ------- - -- -
----- --- --------------- -- ------------------- -------
------ - ------ --------- ----- ----- --
-
------ - ----- ---- --
-
--
-
--
------ ---------- -
--- -
-- ------
--- ----- ------ ---- -- -------------- -
--- -
----- --- - ----- ------------------- ---------------
----------------
- ----- --- -
----------------
-
-
-- -- ---------
----- ------ - ----- ----------------------------
-----------------
- ----- --- -
----------------
-
-----总结
异步迭代器的实现并不容易，需要遵循一些规范来避免一些 Bug。本文详细介绍了如何避免异步迭代器的两种常见 Bug， 并给出了示例代码以供参考。希望本文对读者理解异步迭代器有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64743d0d968c7c53b01a07c3