ES7 中的 Iterator-JavaScript中文网-JavaScript教程资源分享门户

ES7 中的 Iterator

Iterator 是 ES6 中新增加的一种遍历机制，它提供了一种统一的遍历访问数据的方法，可以对数据进行顺序访问，而不用考虑数据的内部结构。在 ES7 中，Iterator 进一步被加强，它现在成为了一种更加通用的迭代器，在许多 JS 库中使用广泛。

概述

Iterator 是一种对象，它定义了一种可以遍历数据的方式。通常情况下，我们使用它来遍历数组、集合、对象等数据类型。实际上，Iterator 还能够遍历许多其他类型的数据结构，例如二叉树、图等。 Iterator 遍历过程中有三个关键的方法：

next()：返回遍历器对象的下一个值。
return(value)：停止遍历，并返回指定值。
throw(exception)：遍历过程中抛出一个异常。

当 Iterator 完成遍历操作时，next() 方法会返回一个具有 done:true 属性的对象，表示遍历已经结束。否则，它会返回每个元素。

配合 ES6 的 for-of 循环语句，我们可以很方便的遍历数组、集合、对象等数据类型。

使用 Iterator 进行数组的遍历

Iterator 遍历一个数组的代码如下所示：

--- --- - ------------
--- ---- - -----------------------
--- ------ - ------------
------------------- -
    --------------------------
    ------ - ------------
-

遍历完后会依次输出 1、2、3、4 和 5。

在 ES7 中，我们可以使用一种更加简洁的方式来遍历数组：

--- --- - ------------
------- - -- ---- -
    ---------------
-

这种方式的语法更加简单明了，而且易于使用。

使用 Iterator 进行 Map 和 Set 的遍历

Map 和 Set 是 ES6 中新增加的两种数据结构，它们存储的是键值对，Map 中的键和 Set 中的元素是不重复的。 Iterator 遍历 Map 和 Set 的代码如下所示：

--- --- - --- ------
-----------------
-----------------
-------------------
--- ---- - -----------------------
--- ------ - ------------
------------------- -
    --- ----- ------ - -------------
    --------------- - --- - -------
    ------ - ------------
-

--- --- - --- ------
---------------
---------------
-----------------
--- ------- - -----------------------
--- --------- - ---------------
---------------------- -
    -----------------------------
    --------- - ---------------
-

遍历完后，Map 中的每个键值对和 Set 中的每个元素都会被输出。

在 ES7 中，我们可以使用一种更加简单的方式来遍历 Map 和 Set：

--- --- - --- ------
-----------------
-----------------
-------------------
------- ----- ------ -- ---- -
    --------------- - --- - -------
-

--- --- - --- ------
---------------
---------------
-----------------
------- - -- ---- -
    ---------------
-

这种语法更加直观明了，使用更加方便。

Iterator 在 Generator 函数中的使用

Generator 函数是 ES6 新增加的一种语法，可以用于创造迭代器，并且改善异步编程的写法。它会返回一个遍历器对象，并且每次遇到 yield 关键字就暂停执行，并返回 yield 后的表达式的值。每次执行遍历器的 next() 方法，就会从暂停的位置继续执行。

而 Iterator 在 Generator 函数中的使用，更加方便了遍历器的创建和使用。

Generator 函数的代码如下所示：

--------- ----- -
    --- - - -- - - --
    ----- ------ -
        ----- --
        --- -- - --- - - ---
    -
-

--- ---- - ------
--- ---- - - -- - - --- ---- -
    -------------------------------
-

这里我们定义了一个 Fibonacci 数列的 Generator 函数，然后使用遍历器的方式输出前 10 个数。

在 ES7 中，我们可以使用 for-await-of 循环语句来进行遍历，代码如下：

----- -------- --------- -
    --- ----- ---- --- -- ------ -
        -- ---- - --- ------
        -----------------
    -
-

----------

这种表达方式更加简介，更好地体现了异步操作的特点，也更加符合现代前端开发的趋势。

结论

Iterator 是一种非常好用和重要的遍历机制，在 ES7 中，它更加通用，更加方便，使用起来也更加简单明了。它是现代前端开发不可或缺的一部分。因此，我们需要学习掌握它的相关知识，并且在实际开发中善于使用它，以提高代码的效率和可读性。

来源：JavaScript中文网，转载请联系管理员！本文地址：https://www.javascriptcn.com/post/66f4d35ac5c563ced565b108