ECMAScript 2017 中的 async 函数：Promise 和 callback 的比较
在前端开发中，异步编程一直是一个热门的话题。异步编程可以提高程序的响应速度和用户体验，但也容易导致回调地狱的出现。ES2017（或称ECMAScript 2017）引入了 async/await 特性，为异步编程带来了很大的便利。
在本文中，我们将讨论 async 函数，它的本质、使用方法以及与传统 callback 和 Promise 的比较。
async 函数是什么？
async 函数是 ES2017 中的一种特殊函数，它的返回值是一个 Promise 对象。虽然它看起来像一个同步函数，但它实际上是一个异步函数。async 函数使用起来非常简单，只需要在函数名称前面加上 async 关键字即可：
async function asyncFunction() { // 函数体 }
在 async 函数内部，可以使用 await 关键字来等待 Promise 对象的执行结果。如果 Promise 对象 resolve，则将 resolve 的值作为 await 表达式的值返回；如果 Promise 对象 reject，则抛出一个异常。
async function asyncFunction() { const result = await someAsyncFunction(); console.log(result); }
上面的代码中，someAsyncFunction() 返回一个 Promise 对象，代码会等待 Promise 对象的状态变为 resolve 后，将 Promise 对象的 resolve 值赋值给 result，并输出 result 的值。
async 函数用途
async 函数主要用于解决异步编程中的回调问题。在 ES2015 之前，我们需要使用回调函数来处理异步操作的结果，回调函数里面又嵌套了回调函数，导致代码非常难以维护。而 ES2015 引入了 Promise 对象，可以更加优雅地处理异步操作的结果，但是 Promise 对象也有一些缺点，例如嵌套过多、代码量过大等等。
ES2017 的 async 函数则是基于 Promise 对象的一种更加优雅、易于维护的异步编程方式。它让我们可以像编写同步代码一样编写异步代码，省略了回调函数、Promise 的 then() 方法，使代码更加简洁易读。
callback、Promise、async 函数比较
下面我们来比较一下 callback、Promise 和 async 函数在某些方面的异同。
- 代码简洁度：
callback 需要嵌套多层回调，代码越来越难以维护；Promise 对象处理效果更好，代码不需要嵌套回调函数，但代码量还是不小；async 函数代码最为简洁、易读，与同步代码相似。
- 错误处理：
callback 的错误处理需要手动添加，不利于代码的封装和维护；Promise 对象的 catch() 方法可以统一处理错误，让错误处理更加简便；async 函数的错误处理方式与 Promise 对象相似，使用 try-catch 语法捕获错误即可。
- 执行效率：
callback 和 Promise 都有一些额外的开销，因为它们都需要创建额外的回调函数。async 函数则不需要额外的回调，执行效率更好。
- API 支持：
大多数 API 倾向于返回 Promise 而不是回调函数，因为 Promise 更加优雅、易于维护。ES2017 引入 async 函数后，大多数 API 也支持 async/await 语法。
综上，使用 async 函数能够让异步编程变得更加优雅、简洁、易于维护。下面是一个 async 函数的示例代码：
async function getUserInfo(userId) {
const userInfo = await fetch(http://api.example.com/users/${userId});
const { name, age } = await userInfo.json();
return { name, age };
}
getUserInfo(123).then(userInfo => { console.log(userInfo); }).catch(error => { console.log(error); });
上面代码中，getUserInfo() 函数使用 fetch() 方法获取用户信息，使用 await 关键字等待 Promise 对象的执行结果，最终返回用户信息。在调用 getUserInfo() 函数时，使用 then() 方法处理 Promise 对象的 resolve 值，使用 catch() 方法处理 Promise 对象的 reject 值。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67ca9a24e46428fe9e2edb8c
