ES10 之 Iterator：异步遍历器 & for-await-of
ES10是JavaScript世界中最新版本的ECMAScript规范，同时也是2019年发布的一款JavaScript开发语言。ES10以迭代器（Iterator）为基础，在异步编程方面引入了新的特性，使得JavaScript变得更加强大和灵活。在本文中，我们将深入探讨ES10的Iterator新特性，并详细介绍异步遍历器和for-await-of。
什么是迭代器？
在JavaScript中，迭代器是一种用于遍历数据结构中的元素的对象。迭代器对象的主要作用是提供一种方法，通过这种方法，可以依次访问结构的每一个元素，而无需了解和记忆其内部实现。
JavaScript中的迭代器是一种基于对象的设计模式，它在大多数编程语言中都有应用。在ES10之前，迭代器主要用在对数组和字符串等数据结构进行迭代操作时，但是ES10升级后，迭代器可以自定义各种数据结构的遍历方式，从而提供更加灵活的应用场景。
异步遍历器
在早期的JavaScript版本中，遍历操作通常是同步的，也就是说，每一个元素都需要等待前面的元素遍历完成才能得到。但是，随着越来越多的异步操作被引入到JavaScript的编程中，对于异步数据的遍历显得越来越重要。
ES10中引入了由异步遍历器（AsyncIterator）对象实现的新接口，用于更加灵活地遍历异步数据。AsyncIterator和Iterator用法类似，但是它允许在异步操作完成后才返回结果。
异步遍历器对象是基于Promise对象实现的，这是一种异步编程中最常用的方式。所以，在我们创建异步遍历器对象时，需要将Promise作为其分辨能力的一部分来指定实现方式。以下是一个值得参考的例子：
-- -------------------- ---- ------- ----- ---------- - -------------------- - -------------- - ---------- - ----- ------------------------- - --- ---- ---- -- --------------- - ----- ----- ----- - - - ------ -- -- - ----- --- - --- ----------- --- ----------------- -- ------------- -- ----------- ------- --- ----------------- -- ------------- -- ----------- ------- --- ----------------- -- ------------- -- ----------- ------ -- --- ----- ---- ---- -- ---- - ------------------ - -----展开代码
在上面的代码中，我们创建了一个异步迭代器类AsyncArray，并使用async关键字指定其异步遍历器（*Symbol.asyncIterator）的实现方式。yield关键字用于暂停执行，等待异步操作完成后再行执行，使用await关键字表示某个操作是异步的。
for-await-of
在ES10中，for-await-of是一种新的语法结构，用于遍历异步操作。for-await-of与for-of类似，只是它允许在循环被暂停时等待异步迭代器对象完成后再次执行。for-await-of语法的基本形式如下：
for await (variable of object) { // 代码块 }
以下是一个完整的使用for-await-of遍历异步数组和异步对象的例子：
-- -------------------- ---- ------- ------ -- -- - ----- --- - --- ----------- --- ----------------- -- ------------- -- ----------- ------- --- ----------------- -- ------------- -- ----------- ------- --- ----------------- -- ------------- -- ----------- ------ -- --- ----- ---- ---- -- ---- - ------------------ - ----- --- - - -- --- ----------------- -- ------------- -- ----------- ------- -- --- ----------------- -- ------------- -- ----------- ------- -- --- ----------------- -- ------------- -- ----------- ------- -- --- ----- ---- ---- -- ------------------- - ------------------ - -----展开代码
在上面的代码中，我们使用for-await-of遍历了异步数组AsyncArray和异步对象obj的所有属性，并打印每个元素的值。当循环暂停等待异步操作完成时，for-await-of允许程序暂停以等待异步操作完成。直到所有异步操作完成后，循环才会继续。
指导意义
ES10 中的 Iterator 新特性为异步操作提供了全新的方式。当我们需要遍历异步数据结构时，可以使用异步遍历器和 for-await-of 语法结构进行操作。
这种方式是一种非常优雅、高效的异步编程方式，可以提高代码的可读性、可维护性，也可以避免对异步操作的阻塞等问题。对于使用 JavaScript 编写的 Web 应用程序，合理地使用 async/await，将会提升应用程序的性能与用户体验。
结语
迭代器是 JavaScript 的基础语言特性之一，也是异步编程强大功能的实现核心。在 ES10 中，JavaScript 引入了异步遍历器和 for-await-of 语法结构，进一步提升了延迟获取和异步编程等方面的能力。
因此，对于有志于成为优秀前端工程师的开发者来说，灵活运用 ES10 的迭代器和异步编程等特性，将会是日常开发中常常需要思考、掌握和运用的知识点之一。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67b6a646306f20b3a62c61bc
