在前端开发中，处理数据流是一个常见的任务。ECMAScript 2019 中的迭代器和生成器是帮助我们更方便地处理数据流的强大工具。本文将介绍迭代器和生成器的基本用法，以及如何将它们用来处理数据流操作。
迭代器
迭代器是一种用于遍历集合的对象。我们使用 for...of 循环可以遍历任何可迭代对象（例如数组、字符串、Map、Set 等）。在 ECMAScript 2015 中，我们引入了内置的迭代器概念，并且定义了 Symbol.iterator 方法来返回一个对象的迭代器。在 ECMAScript 2019 中，我们引入了两个新的方法：Object.fromEntries() 和 String.prototype.matchAll()，它们都使用了迭代器。
创建一个迭代器
我们可以使用生成器函数创建一个迭代器。生成器函数使用特殊的 function* 语法定义，并使用 yield 关键字向调用者返回值。当我们调用一个生成器函数时，它实际上返回了一个迭代器，我们可以使用迭代器的 next() 方法从生成器函数的执行暂停处继续执行。
以下是一个使用生成器函数创建迭代器的示例：
-- -------------------- ---- ------- --------- -------------- - ----- -- ----- -- ----- -- - ----- -------- - --------------- -- ------- ----------------------------- -- - ------ -- ----- ----- - ----------------------------- -- - ------ -- ----- ----- - ----------------------------- -- - ------ -- ----- ----- - ----------------------------- -- - ------ ---------- ----- ---- -
生成器函数可以暂停和恢复它的执行，这是它们和普通函数的主要区别。
使用迭代器处理数据流
使用迭代器可以方便地处理数据流。我们可以使用迭代器来遍历一个集合，并对每个元素执行一些操作。以下是一个简单的例子，它遍历一个数组并在每个元素上加上 1：
-- -------------------- ---- -------
-------- ------------- -
--------- -------------- -
--- ---- - - -- - - ------------- ---- -
----- -------- - --
-
-
----- -------- - ---------------
----- ------ - ---
--- ------ ----- -- --------- -
-------------------
-
------ -------
-
---------------------- -- ----- -- --- -- --使用 Symbol.iterator
我们可以使用 Symbol.iterator 创建一个自定义的迭代器。Symbol.iterator 是一个特殊的符号，如果一个对象有 Symbol.iterator 方法，那么它就是一个可迭代对象。
以下是一个示例，它使用 Symbol.iterator 返回一个数组的迭代器：
-- -------------------- ---- -------
----- ------- - --- -- ---
------------------------ - --------- -- -
--- ----- - --
----- ------ - ------------ -
----- ------------
--------
-
--
----- -------- - ---------------------------
----------------------------- -- - ------ -- ----- ----- -
----------------------------- -- - ------ -- ----- ----- -
----------------------------- -- - ------ -- ----- ----- -
----------------------------- -- - ------ ---------- ----- ---- -生成器
生成器是一种特殊类型的迭代器，它们允许我们通过调用 yield 关键字暂停函数的执行，并在需要时恢复执行。生成器函数是一种特别的函数，可以返回一个生成器。
创建一个生成器
生成器函数使用特殊的 function* 语法定义，并使用 yield 关键字向调用者返回值。以下是一个简单的生成器函数示例：
-- -------------------- ---- -------
--------- ----------- -
--- - - --
--- - - --
----- ------ -
----- --
--- -- - --- - - ---
-
-
----- -------- - ------------
----------------------------- -- - ------ -- ----- ----- -
----------------------------- -- - ------ -- ----- ----- -
----------------------------- -- - ------ -- ----- ----- -
----------------------------- -- - ------ -- ----- ----- -使用生成器处理数据流
使用生成器可以轻松地处理数据流。下面是另一个简单的示例，它通过调用另一个生成器来重复执行某些操作：
-- -------------------- ---- -------
--------- --------- --- -
--- ---- - - -- - - -- ---- -
----- ------
-
-
-------- --------- -
------ - - --
-
----- -------- - --------- --------
--- ------ ----- -- --------- -
------------------- -- -- -- -
-总结
迭代器和生成器是 ECMAScript 2019 中的两个强大的概念。使用它们可以轻松地处理数据流，遍历集合并对每个元素执行某些操作。本文提供了一些基本用法和示例代码，希望可以帮助你更好地理解迭代器和生成器，同时也可以让你在开发中更高效地处理数据流操作。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/651a72ea95b1f8cacd2612ba