在ECMAScript 2018标准中，迭代器和生成器是JavaScript编程语言的两种强大的特性。以前的JavaScript版本中，我们需要手动编写代码来迭代数组或对象。但是，迭代器和生成器可以极大地简化我们的工作，特别是在处理大量数据或需要异步操作时。
迭代器：遍历数组或对象的新方法
迭代器提供了一种新的方法来遍历数组或对象的元素，而不必使用传统的for循环或forEach()函数。它是一种有序的数据结构，可以使用next()函数按顺序一个一个地获取元素，直到没有下一个元素。
迭代器的创建
我们可以使用Symbol.iterator创建迭代器，它是一个特殊的JavaScript程序包含一个方法，该方法返回迭代器对象本身。
下面的代码演示了如何创建一个迭代器：
const myArray = [1,2,3,4]; //定义一个数组 const iterator = myArray[Symbol.iterator](); //创建迭代器
我们可以使用next()函数迭代元素。返回值是具有两个属性的对象：value和done。
- value：前一个元素的值。
- done：如果数组已经遍历完成，返回true；否则，返回false。
下面的代码演示了如何使用迭代器遍历数组：
const myArray = [1,2,3,4];
const iterator = myArray[Symbol.iterator]();
console.log(iterator.next()); // { value: 1, done: false }
console.log(iterator.next()); // { value: 2, done: false }
console.log(iterator.next()); // { value: 3, done: false }
console.log(iterator.next()); // { value: 4, done: false }
console.log(iterator.next()); // { value: undefined, done: true }迭代器的应用
迭代器的应用不仅限于遍历数组，它也可以用于迭代对象。我们可以通过创建一个包含键值对的对象，然后返回一个包含对应的迭代器对象。下面是一个例子：
-- -------------------- ---- -------
--- ----- - -
----- ------
---- ---
------- -------
------------------ ---------- -
--- ---- - ------------------
--- ----- - --
------ -
----- -- -- -
------ -
------ --------------------
----- ----- - -----------
--
-
-
-
-
------- --- -- ------ -
-----------------
-上述代码中，我们定义了一个包含键值对的对象myObj。我们通过[Symbol.iterator]创建一个迭代器函数，返回一个包含next()函数的对象。在next()函数中，我们定义了一个变量keys，它包含了myObj对象的所有键。我们使用index迭代到下一个键，并返回一个包含值和完成状态的对象。最后，我们使用for...of循环遍历myObj对象。
生成器：异步编程的好帮手
与迭代器不同，生成器是一种在JavaScript中实现异步编程的方法。它是一个函数，返回一个带有next()函数的对象，可以用于生成序列。生成器的优点在于它的开发方式更加简单明了，并且可以更容易地实现异步编程。
生成器的创建
我们可以使用function*定义一个生成器函数，然后使用yield关键字生成值。 下面是一个例子：
-- -------------------- ---- ------- --------- ------------- - ----- -- ----- -- ----- -- - ----- -------- - -------------- ----------------------------- -- - ------ -- ----- ----- - ----------------------------- -- - ------ -- ----- ----- - ----------------------------- -- - ------ -- ----- ----- - ----------------------------- -- - ------ ---------- ----- ---- -
上述代码中，我们定义了一个包含yield指令的生成器函数，用于生成序列1,2,3。 然后，我们可以通过调用next()函数迭代值。
生成器的应用
生成器常常应用于实现异步编程，特别是在遇到需要等待操作完成后，再继续操作下一个步骤的情况。 在这种情况下，我们可以使用yield指令暂停函数的执行，等待操作完成后，再恢复函数的执行。 下面是一个使用生成器实现异步编程的例子：
-- -------------------- ---- -------
-------- ------------ -
------ ----------
-------------- -- ----------------
---------- -- ------
-
--------- ------------------ -
----- ----- - ----- --------------------------------------------------------
----- ----- - ----- --------------------------------------------------------
-------------------
-------------------
-
----- -------- - -------------------
----- -------- - ----------------------
------------------- -- -
----- -------- - ---------------------------
------------------- -- -
---------------------
---
---上述代码中，我们使用yield指令暂停异步函数的执行，等待异步操作完成后再继续调用next()函数。我们使用fetch()方法获取数据并将结果解析为JSON格式的数据。在迭代过程中，我们使用了yield指令暂停函数的执行，等待异步操作完成后，再继续调用next()函数。我们使用了JavaScript Promise来实现异步操作的管理。
总结
在ECMAScript 2018标准中，迭代器和生成器是两种非常强大的特性，它们提供了一种新的迭代和异步编程方法。在大多数情况下，使用迭代器和生成器会让我们的代码更加简洁。 迭代器和生成器是一些强大的技术，如果能够正确地应用它们，我们的JavaScript程序将更加稳定、高效，并且易于维护。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64e6f0bdf6b2d6eab32462ca