在 JavaScript 编程中,迭代器是一种能够遍历数据结构中各个元素的对象。在 ES6 中,我们已经看到了这个新特性的引入。但是,ES6 中迭代器的实现相比于其他语言可能还显得有些简陋,不足以满足我们在实际开发中遍历数据结构的需求。
这时,ES2016 为 for..of
循环添加了更加灵活的支持,让我们可以使用迭代器更加自由地遍历自定义数据结构。
使用迭代器遍历数组和字符串
在 ES6 中,我们已经能够使用迭代器遍历数组和字符串,如下所示:
--- --- - --- -- -- --- --- -------- - ----------------------- ----------------------------- ----------------------------- ----------------------------- ----------------------------- ----------------------------- -- ------- ---------- ----- -----
用 Symbol.iterator
属性获取数组的迭代器,然后通过调用 next
方法来遍历数组中的元素。
同样,我们也可以遍历字符串:
--- --- - ------ -------- --- -------- - ----------------------- --- ---- ---- -- --------- - ------------------ -- --- --- --- --- --- - - --- --- --- --- --- --- -
使用 for..of
循环更加简便和易读。
创建自定义迭代器
我们也可以创建自定义迭代器来遍历不同的数据结构。下面是一个自定义迭代器的示例代码。
----- -------- - - ------------------- - --- ----- - -- ------ - ------ - -- ------ - -- - ------ - ------ -------- ----- ----- -- - ---- - ------ - ------ ---------- ----- ---- -- - - -- - -- --- ---- --- -- --------- - ----------------- -- - - - - - -
在这个示例代码中,我们创建了一个 iterable
变量,它是一个具有 Symbol.iterator
属性的对象。此属性上的函数返回了如何遍历数据结构的迭代器对象。
面向类的迭代器
如果你的数据结构是面向类的,那么在 ES2016 中创建自定义迭代器就更加容易了。
----- ----- - ------------------ ---- - ---------- - ------ -------- - ---- - ------------------- - --- ------- - ----------- --- ---- - --------- ------ - ------ - -- -------- -- ----- - --- ----- - -------- ---------- ------ - ------ ------ ----- ----- -- - ---- - ------ - ----- ---- -- - - -- - - --- ------ --- -- --- -------- --- - ----------------- -- - - - - - -
这是一个简单的 Range
类,返回一个可以遍历区间内数字的迭代器对象。
支持异步操作的迭代器
如果你正在使用异步代码,那么你也可以使用迭代器遍历异步数据。在 ES2018 中给出了异步迭代器的支持。下面是一个 fetch
请求的示例代码,它使用异步迭代器来获取多个url中的数据。
----- --------- --------------- - --- ------ --- -- ----- - --- -------- - ----- ----------- --- ---- - ----- ---------------- ----- ----- - - ------ -------- -- - --- ----- ------ ---- -- ----------- --------------------------- --------------------------- -------------------------- --- - ------------------ - -----
在这个示例代码中,我们定义了一个 fetchUrls
异步迭代器,它返回所有请求的数据。我们通过 for await..of
循环来遍历它的结果。这样一来,我们可以方便地处理大量异步操作的数据。
总结
ES2016 推出了更加灵活的 for..of
循环,更加自由地使用迭代器来遍历各种自定义数据结构。同时,这个特性还提供了许多其他的优秀方式来使用迭代器。
如果你使用迭代器的频率较高,那么 ES2016 中引入的这些新特性一定会让你感到愉快和兴奋。在使用迭代器的过程中,不断地学习和尝试新的方法,一定会让你的代码变得更加优美和简洁。
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/64f963acf6b2d6eab30e665d