在前端开发中，异步操作是经常遇到的问题。在过去，我们使用回调函数或者Promise解决这个问题。然而，这些方法看起来仍然有些笨拙，代码也很难阅读和维护。随着 ECMAScript 2016 的发布，开发者们可以使用 async/await 来更优雅地解决异步操作问题。
async/await 是什么？
async/await 是 ECMAScript 2016 中新增的新特性，它使用了一种全新的方式来处理异步操作。在使用 async/await 时，我们可以像同步函数一样编写异步程序。它通过 async 和 await 函数来达到这个目的。async 函数用于声明一个异步函数，而 await 则用于暂停异步函数的执行直到 Promise 返回结果。
异步操作的新体验
下面我们来看一个使用 async/await 的例子：
async function loadData() {
const response = await fetch('https://api.github.com/users/github');
const data = await response.json();
console.log(data);
}
loadData();在这个例子中，我们使用了 fetch 函数来获取 Github 用户的信息。fetch 函数返回的是一个 Promise，因此我们在等待 fetch 函数的 Promise 返回结果时使用了 await。在第二行，我们在等待一个新的 Promise 返回结果，这个 Promise 将 fetch 函数返回的 Response 对象解析成 JSON 格式。
这个方式非常简单易懂，代码也看起来清晰易读。相较于回调和 Promise，async/await 前景非常光明。
async/await 的优势
使用 async/await 会带来许多好处：
更简单、易读的代码
async/await 的特点就是代码清晰、可读性强。因为它允许开发者像写同步代码一样处理异步调用，避免了原来回调的嵌套；同时，也避免了 Promise 的 then 链式调用。
更少的错误
使用 async/await 时，可以检查出很多错误。因为有了 async/await，开发者们无需考虑回调中出现的错误，而是可以集中精力处理整个声明中的错误。
更少的嵌套
async/await 的另一个优势就是不需要嵌套回调函数。相较于使用 Promise，使用 async/await 时，你可以在同一级别的代码块中编写代码而不需要嵌套。
总结
在前端开发中，解决异步操作是非常重要的。而 async/await 的出现，为开发者们带来了新的解决方案。async/await 可以让异步代码更加清晰易读，并且可以避免 Promise 的回调嵌套。开发者们应该学习并使用 async/await 来更好地解决异步问题。
附录
在某些早期版本中，async/await 可能无法直接使用，因此需要在代码中加入额外的代码兼容性处理，例如使用 Babel 编译器。以下是兼容性代码：
require('babel-core/register')({
presets: ['es2015', 'es2016', 'es2017'],
plugins: ['transform-runtime']
});
require('babel-runtime/regenerator'); // 需要引入这个 runtime
async function foo () {}来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/652b8a0f7d4982a6ebd5fc26