JavaScript 是一种单线程语言，异步编程为了解决阻塞线程产生的延迟，因此在 ES6 中引入了 Promise，用于处理异步操作。而 ES2017 中新增了 async/await 关键字，进一步简化了代码，提高了阅读性，并且可处理更加复杂的异步任务。
async/await 是什么？
async/await 是基于 Promise 实现的一种简化异步编程的语法糖。async/await 让异步调用看起来像同步，我们可以使用同步的方式去处理异步的返回值。
使用 async 关键字来定义一个函数，函数中的任何异步操作被封装成 Promise 对象。然后使用 await 关键字来等待这个异步过程，一直等到这个异步操作执行完成并且返回结果。
async/await 为什么有用？
async/await 的好处不仅仅是更加简洁易懂，不再需要使用链式调用的方式来处理异步操作，可读性会更好。同时，async/await 也避免了回调地狱的问题，通过 async/await，可以使用 try/catch 来处理异常，而不是使用回调函数。
除此之外，async/await 优化了异步代码的可维护性。比如，我们需要实现一个异步任务队列，如果使用 Promise 实现，每个异步操作需要包装成 Promise，感觉有些繁琐，而用 async/await 实现起来会更加简单和直观。
如何使用 async/await？
下面是一个使用 async/await 的简单示例：
async function getData() {
const response = await fetch('https://jsonplaceholder.typicode.com/todos/1');
const data = await response.json();
console.log(data);
}
getData();这个例子中，我们通过使用 async 关键字来定义一个 async 函数，函数中使用 await 关键字来等待异步操作执行完成并返回结果，例如使用 fetch 方法请求数据。
在这个过程中，js 程序会停止执行，直到异步操作返回结果。一旦异步操作返回结果，数据就会被赋值给变量，程序继续往下执行。
如果异步操作有异常，我们可以使用 try/catch 来处理异常，如下所示：
-- -------------------- ---- -------
----- -------- --------- -
--- -
----- -------- - ----- ------------------------------------------------------
----- ---- - ----- ----------------
------------------
- ----- --- -
---------------
-
-
----------当 try 中的代码块抛出异常时，程序会跳转到 catch 中的异常代码块，并输出错误信息。
async/await 的局限性
使用 async/await 得益于 Promise 的实现，异步操作本身不能被取消。我们需要等待异步操作完成或者抛出异常。
另外，async/await 只能用于在 Chrome 55+、Firefox 52+、Safari 10.1+、以及 Edge 14+ 等浏览器中，低版本浏览器不支持。如果要使用 async/await，建议了解构建工具的使用，以便将代码转换成 ES5 语法。
总结
async/await 提供了更加简单和可读性更好的方式去处理异步操作，简化了异步编程的难度，方便了代码的调试和维护。想要掌握 async/await，需要深入理解 Promise 的概念和使用，同时留意一些限制和注意事项，可以大大提高代码效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64ded7f8f6b2d6eab39fa7e4