在现代的 web 应用程序中，异步任务已经成为了普遍存在的一种编程模式。在过去，我们使用回调函数来处理异步任务，但是这种方式很容易导致回调地狱，代码难以维护。现在，我们可以使用 ECMAScript 2019 (ES10) 中引入的 async 函数来处理多个异步任务，使得代码更加清晰易读。
async 函数简介
async 函数是 ECMAScript 2019 (ES10) 中引入的一种新的语言特性，它使得异步任务的处理更加简单易读。async 函数是基于 Promise 的，它可以让我们使用类似于同步代码的方式来编写异步代码。async 函数的语法如下：
async function functionName() {
// 异步任务
}async 函数的返回值是一个 Promise 对象，我们可以使用 then 方法来处理异步任务的结果。如果 async 函数中抛出了异常，那么 Promise 对象的状态就会变成 rejected，我们可以使用 catch 方法来处理异常。
处理多个异步任务
在实际开发中，我们通常需要处理多个异步任务，而且这些任务之间可能存在依赖关系。在 ES10 中，我们可以使用 async 函数和 await 关键字来处理多个异步任务。
处理多个独立的异步任务
如果多个异步任务之间没有依赖关系，我们可以使用 Promise.all 方法来并行处理这些任务。Promise.all 方法接收一个 Promise 对象数组作为参数，返回一个 Promise 对象，当所有的 Promise 对象都成功时，Promise.all 的 Promise 对象才会成功，返回值是一个数组，包含了每个 Promise 对象的结果。
async function handleMultipleTasks() {
const result = await Promise.all([
asyncTask1(),
asyncTask2(),
asyncTask3()
]);
console.log(result);
}上面的代码中，我们使用 await 关键字来等待 Promise.all 方法的返回值，Promise.all 方法并行执行了 asyncTask1、asyncTask2 和 asyncTask3 三个异步任务，当它们都成功时，Promise.all 的 Promise 对象就会成功，返回值是一个数组，包含了每个 Promise 对象的结果。
处理多个有依赖关系的异步任务
如果多个异步任务之间存在依赖关系，我们可以使用 await 关键字来顺序执行这些任务。在 await 关键字后面，我们可以使用 Promise 对象的 then 方法来处理异步任务的结果。
async function handleMultipleTasks() {
const result1 = await asyncTask1();
const result2 = await asyncTask2(result1);
const result3 = await asyncTask3(result2);
console.log(result3);
}上面的代码中，我们先执行 asyncTask1 异步任务，等待它的返回值，然后将返回值传递给 asyncTask2 异步任务，再等待 asyncTask2 的返回值，最后将 asyncTask2 的返回值传递给 asyncTask3 异步任务，等待 asyncTask3 的返回值。
总结
在 ECMAScript 2019 (ES10) 中，我们可以使用 async 函数和 await 关键字来处理多个异步任务，使得代码更加清晰易读。如果多个异步任务之间没有依赖关系，我们可以使用 Promise.all 方法来并行处理这些任务；如果多个异步任务之间存在依赖关系，我们可以使用 await 关键字来顺序执行这些任务。在实际开发中，我们可以根据具体的需求来选择不同的处理方式。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6506e4a395b1f8cacd2825e9