介绍
ES7 中新增的 async/await 语法是协程（coroutine）的一种实现方式，它让开发者可以使用类似同步处理的方式来处理异步任务，使得异步代码更加清晰、易读、易维护。await 是 async/await 语法中非常重要的一部分，它用来等待一个异步函数的执行完成并返回结果。
在我们以往的经验中，一次只承载一个异步任务执行这样的方式的确非常清晰，但是有时候我们也需要同时处理多个异步任务，比如同时获取多个资源，同时上传多个文件等等。在这种情况下，ES7 的 await 又该如何使用呢？
接下来，我将为大家详细介绍 ES7 的 await 在处理多个任务时的使用方式，并提供示例代码。
处理多个任务的方法
1. 逐个执行并等待结果
最直观的处理方式就是将多个任务逐个执行，并等待每个任务的结果，代码如下：
----- -------- --------- - ----- ------- - ----- -------- ----- ------- - ----- -------- ----- ------- - ----- -------- -- --- ----- ------- - ----- -------- ------ --------- -------- -------- -- --- -- --------- -
上述代码中，我们创建一个名为 doTasks 的异步函数，函数内依次使用 await 等待每一个异步任务返回的结果，然后将这些结果组装成数组 result 并返回。这种方式确保任务按照顺序执行，并且每个任务的执行有间隔，保证前一个任务完成后再执行下一个任务，但是也存在明显的缺点：任务的串行执行可能会导致我们浪费了一些等待上一个任务完成的时间。
在某些情况下，我们希望多个任务可以同时执行，然后在所有任务完成后再获取它们的结果，下面来介绍一下这种情况下的处理方式。
2. 并行执行并等待结果
为了同时执行多个任务，可以使用 Promise.all() 方法，它接受一个 Promise 数组作为参数，返回一个新的 Promise，新 Promise 的成功回调函数的参数为 Promise 数组中所有 Promise 对象的结果数组。在 async/await 语法中，我们可以将 Promise.all() 与 await 一起使用，代码如下：
----- -------- --------- - ----- --------- -------- -------- -- --- -- -------- - ----- --------------------- -------- -------- -- --- -- ---------- ------ --------- -------- -------- -- --- -- --------- -
上述代码中，我们创建一个名为 doTasks 的异步函数，函数内使用 Promise.all() 方法并传入多个 Promise（异步函数）对象，然后在同时执行这些 Promise 对象的任务后，使用 await 等待所有任务返回的结果，将这些结果组装成数组 result 并返回。
需要注意的是，在这个方法中我们的所有任务将会并行执行，并且因为都是异步执行，所以执行顺序和结果顺序不一定和我们传入的顺序一致。
示例
下面为大家提供一个 示例，利用上述两种方法异步请求多个 GitHub 用户信息：
----- -------- ---------------- -
----- --------- - ------------- ---------- ---------- -------------------
-------------------------------
-- -- ---------
----- ------ - ---
--- ---- - - -- - - ----------------- ---- -
----------------- ------------------------------------------------------------------- -- ------------------
-
--------------------
-- -- ---------
----- ------ - ----- ---------------------------------- -- --------------------------------------------------------------- -- -------------------
--------------------
----------------------------------
-上述代码中，我们首先定义了一个包含多个 GitHub 用户名的数组 usernames，然后使用两种不同的方式进行请求和返回所得到的所有用户信息。最后，我们通过 console.log() 将获取到的用户信息打印在控制台上。
总结
在本文中，我们详细介绍了 ES7 的 await 在处理多个任务时的使用方式，并分享了两种由此衍生的方法：逐个执行并等待结果、并行执行并等待结果。希望大家可以灵活应用上述方法，让异步任务处理更加高效，代码更加简洁易读。如有问题，欢迎在评论区留言交流。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/64719c9c968c7c53b0f7e875