在编写异步代码时，往往需要嵌套多层回调函数或使用 Promise 对象来处理回调。这不仅使代码难以阅读，而且容易出现一些问题，比如 Promise chaining 和 Promise 的 error handling 等。随着 ES6 的出现，引入了 async/await 语法糖来帮助我们更轻松地编写异步代码。
async/await 的基本语法
async/await 是 ES6 的异步操作语法糖，用于简化 Promise 和 Generator 函数的操作，使异步代码看起来更像同步代码。其中，async 定义了一个异步函数，而 await 用于等待 Promise 对象并返回 Promise 对象的结果。
下面是 async/await 的基本语法：
async function foo() {
try {
const result = await promise;
console.log(result);
} catch (error) {
console.log(error);
}
}上面的代码中，异步函数 foo 在执行到 await promise 中断，直到 promise 对象 resolved（或 rejected）。如果 promise 对象 resolved，则将其结果作为 await 表达式的值返回，否则将抛出一个异常。
async/await 的应用案例
async/await 可以替代 Promise 和 Generator 函数，使异步操作变得更加简单和可读。下面是一些应用案例。
调用多个异步函数
当需要调用多个异步函数时，可以使用 Promise.all 方法将它们封装在一个 Promise 对象中，然后使用 await 等待 Promise 对象完成。
async function foo() {
const [result1, result2, result3] = await Promise.all([
asyncFunc1(),
asyncFunc2(),
asyncFunc3(),
]);
console.log(result1, result2, result3);
}处理 Promise 的错误
使用 async/await 可以更加方便地处理 Promise 的错误。在 async 函数中使用 try/catch 块捕获异常，并使用 throw 语句抛出错误。
-- -------------------- ---- -------
----- -------- ----- -
--- -
----- ------ - ----- --------
--------------------
- ----- ------- -
-------------------
----- ------
-
-使用 async/await 替代 Promise chaining
使用 async/await 可以代替 Promise chaining，使异步操作更加直观和简单。
async function foo() {
const result1 = await asyncFunc1();
const result2 = await asyncFunc2(result1);
const result3 = await asyncFunc3(result2);
console.log(result3);
}总结
async/await 是 ES6 的语法糖，可以使异步操作变得更加直观和简单。通过使用 async/await，我们可以避免使用回调函数和 Promise chaining 产生的代码混乱和错误，同时提高代码可读性和可维护性。在实际开发中，建议多加尝试并练习使用 async/await，以提高代码质量和效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/647d9d4f968c7c53b0868785