在以往的 JavaScript 中，处理异步任务比较困难，需要使用回调函数、Promise 或 async/await 等方式来处理异步任务，代码可读性和可维护性都不高。而在 ES10 中加入了一个新的特性——for-await-of 迭代器，可以更方便地处理异步任务。
什么是迭代器？
在 JavaScript 中，迭代器是一个统一的遍历接口，可以遍历不同类型的数据，比如数组、对象、字符串等。使用迭代器可以更方便地获取数据，增加了代码的可读性和可维护性。
迭代器接口需要实现 next() 方法，返回一个包含 value 和 done 两个属性的对象，表示当前遍历到的值和遍历是否完成。当 done 为 true 时，表示迭代器结束。
const arr = [1, 2, 3];
const iter = arr[Symbol.iterator]();
console.log(iter.next()); // { value: 1, done: false }
console.log(iter.next()); // { value: 2, done: false }
console.log(iter.next()); // { value: 3, done: false }
console.log(iter.next()); // { value: undefined, done: true }for-await-of 迭代器
在 ES10 中，提供了 for-await-of 迭代器，用于遍历异步任务。for-await-of 迭代器是在 for-of 迭代器的基础上扩展而来，可以依次获取每个异步任务的返回结果。
-- -------------------- ---- -------
----- -------- ----------- -
----- ---- - ----- -------------------------------------
------ ------------
-
----- -------- ------------- -
----- ------ - ---
--- ----- ------ ---- -- ------------ -
------------------
-
--------------------
-上述代码中，fetchData 函数返回一个异步任务，for-await-of 迭代器可以依次获取每个异步任务的返回结果，并将结果添加到 result 数组中。
迭代器的错误处理
当异步任务中发生错误时，for-await-of 迭代器会停止迭代，并抛出错误。为了保证异步任务能够正确处理异常，需要在异步任务中使用 try/catch 来捕获错误信息。
-- -------------------- ---- -------
----- -------- ----------- -
--- -
----- ---- - ----- -------------------------------------
------ ------------
- ----- ------- -
---------------------
----- ------
-
-
----- -------- ------------- -
----- ------ - ---
--- -
--- ----- ------ ---- -- ------------ -
------------------
-
- ----- ------- -
---------------------
-
--------------------
-上述代码中，如果异步任务中发生错误，会将错误信息打印到控制台，并将错误抛出。在迭代器中捕获错误信息并打印到控制台。
迭代器的取消操作
在某些情况下，需要取消迭代器的操作，比如当用户在遍历时手动停止。
ES10 中提供了返回包含 done 和 value 两个属性的迭代器对象可以调用其 return 方法来取消操作。
-- -------------------- ---- -------
----- -------- ----------- -
--- -
----- ---- - ----- -------------------------------------
------ ------------
- ----- ------- -
---------------------
----- ------
-
------ - ----- ---- --
-
----- -------- ------------- -
----- ------ - ---
----- ---- - ------------
--- -
--- ----- ------ ---- -- ----- -
-- -------------- -
--------------
------
-
------------------
-
- ----- ------- -
---------------------
-
--------------------
-上述代码中，如果用户手动停止遍历，可以调用迭代器对象的 return 方法来取消遍历。
总结
for-await-of 迭代器是处理异步任务的一种新方式，可以更方便地处理异步任务，并会自动处理异步任务中的错误和取消操作，增加了代码的可读性和可维护性。在使用 for-await-of 迭代器时需要注意错误处理和取消操作，以保证异步任务的正确性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64d2067db5eee0b5259652da