在 ES9 中，新增了一个语句 for await of 操作符，用于异步遍历可迭代对象。其语法与 for of 相似，但是可以在异步操作中使用。
什么是异步遍历？
在 JavaScript 中，我们经常需要遍历数组、对象等数据结构。在同步代码中，我们使用 for 循环或者 forEach 等语句来进行遍历，代码如下：
const arr = [1, 2, 3];
for (let i = 0; i < arr.length; i++) {
console.log(arr[i]);
}
// 输出：1 2 3
arr.forEach(item => console.log(item));
// 输出：1 2 3但是，在异步代码中，我们需要等待每个异步操作完成后才能进行下一个操作。例如，我们需要从服务器获取数据后再进行渲染，代码如下：
-- -------------------- ---- ------- ----- -------- ----------- - ----- ---- - ----- ------------------- ----- ---- - ----- ------------ ------ ----- - ----- -------- -------- - ----- ---- - ----- ------------ -- ---- -
在这种情况下，我们需要异步遍历数据结构，等待每个异步操作完成后才能进行下一个操作。
为什么需要 for await of 操作符？
在 ES6 中，我们引入了 for of 语句用于遍历可迭代对象，例如数组、字符串、Set 等。但是，for of 只能用于同步操作，不能用于异步操作。
在 ES7 中，我们引入了 async/await 语句用于异步操作。但是，async/await 语句只能用于单个异步操作，不能用于异步遍历。
因此，在 ES9 中，我们引入了 for await of 操作符用于异步遍历可迭代对象，可以方便地处理异步操作。
如何使用 for await of 操作符？
for await of 操作符的语法与 for of 相似，但是需要使用 async/await 语句来处理异步操作。例如，我们可以使用 for await of 遍历一个 Promise 对象数组，代码如下：
-- -------------------- ---- -------
----- -------- ----------- -
----- --- - -
--------------------
--------------------
-------------------
--
----- ------ - ---
--- ----- ------ ---- -- ---- -
----- ---- - ----- ------------
------------------
-
------ -------
-在上面的代码中，我们使用 for await of 遍历了一个 Promise 对象数组，等待每个异步操作完成后再进行下一个操作。注意，我们需要在 for await of 中使用 async/await 语句来处理异步操作，以便等待每个异步操作完成后再进行下一个操作。
总结
在 ES9 中，我们新增了一个语句 for await of 操作符，用于异步遍历可迭代对象。它的语法与 for of 相似，但是可以在异步操作中使用。使用 for await of 操作符可以方便地处理异步操作，提高代码的可读性和可维护性。
在实际开发中，我们经常需要处理异步操作，使用 for await of 操作符可以简化代码，提高开发效率。但是，需要注意使用 async/await 语句来处理异步操作，以便等待每个异步操作完成后再进行下一个操作。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/658bb14deb4cecbf2d0ed7b5