JavaScript 作为一门脚本语言，其语言特性的不断迭代和更新十分迅速。在 ECMAScript 2018 (ES9) 中，迭代器和生成器的新特性得到了升级和完善，这也成为了前端开发的一个重要趋势。
迭代器和生成器的基本概念
在 JavaScript 中，迭代器是一个对象，该对象实现了一个 next() 方法，可用于逐个访问复杂数据类型中的元素。而生成器是一种更方便的创建迭代器的语法，通过 function* 声明一个生成器函数，就可以使用 yield 关键字在函数内部返回值，并且暂停执行。
ES9 迭代器的新特性
for-await-of 循环
在 ES9 中，开发者可以使用 for-await-of 来循环异步代码，该循环可以在异步函数中顺序执行异步操作，并等待每个异步任务完成后进入下一步。这个功能同样也支持同步操作，本质上就是对普通 for-of 循环的一个扩展和升级。
下面是一个简单的 for-await-of 循环的例子：
-- -------------------- ---- -------
----- -------- ----------- -
----- ----- - ----- ------------------------------------------------------
----- ----- - ----- ------------------------------------------------------------ - -----
----- ----- - ----- ------------------------------------------------------------ - -----
------ ------ ------------- ----- ------------- ----- --------------
-
------ ---------- -
--- ----- ------ ---- -- ------------ -
------------------
-
-----迭代器元数据
在 ES9 中，在迭代器对象上添加了一些与元数据相关的处理方法，包括获取已完成的迭代器操作数，以及在迭代器操作时维护元数据信息等。
例如，可以使用 Iterator.prototype.return() 方法在迭代器遇到错误时强制退出，并在 finally 中执行一些清理代码：
-- -------------------- ---- -------
--------- ----- -
--- -
----- --
----- --
----- --
- ------- -
-----------------------
-
-
----- -------- - ------
-----------------------------
-- ------- -- ----- ------
-------------------------------
-- -------
-- ------- ---------- ----- -----
-----------------------------
-- ------- ---------- ----- -----对于 JavaScript Map 和 Set 新的迭代器
在 ES9 中，Map 和 Set 对象都新增了一种用于获取键或值的迭代器类型，分别为 Map.prototype.keys() 和 Set.prototype.values()。
const set = new Set([1, 2, 3]); const map = new Map([['a', 1], ['b', 2], ['c', 3]]); console.log([...set.values()]); // [1,2,3] console.log([...map.keys()]); // ["a","b","c"]
ES9 生成器的新特性
Promise.prototype.finally()
在 ES9 中，Promise 内置了一个 finally() 方法，该方法在 Promise 进入 fulfilled 或 rejected 状态时，都会执行一些清理操作。该方法不改变 Promise 的状态，并且可以对拒绝和成功状态下的 Promise 进行清理操作。它是在链式 Promise 中使用起来更为方便。
下面是一个使用 finally() 方法的例子：
-- -------------------- ---- ------- ------------------ -------- -- -- ----------- -- ----------------------- ------------------- -- - -- ------- ----------------- --------- -- -- ----------- -- ----------------------- ------------------- -- - -- -------
异步生成器
在 ES9 中，开发者可以通过 async 关键字和 yield 关键字，在生成器函数中实现异步操作。
下面是一个异步生成器函数的例子：
-- -------------------- ---- -------
----- --------- --------- -
--- - - --
----- ------ -
----- --- --------------- -- ------------------- -------
----- ----
-
-
------ ---------- -
--- ----- ---- ----- -- ---------- -
------------------
-
-----总结
在 ES9 中迭代器和生成器得到了升级和完善，增强了 JavaScript 强大的迭代和生成功能，使开发者可以在异步编程和生成数据时获得更多的技术支持，提高了代码的可读性和可维护性。在开发实践中，我们应该充分掌握这些新特性，并在使用时充分注意它们的语言规范和使用方法。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65379fdb7d4982a6eb030626