ES6 系列十：async和await

快来加入我们吧！

"小和山的菜鸟们"，为前端开发者提供技术相关资讯以及系列基础文章。为更好的用户体验，请您移至我们官网小和山的菜鸟们 进行学习，及时获取最新文章。

"Code tailor" ，如果您对我们文章感兴趣、或是想提一些建议，微信关注 “小和山的菜鸟们” 公众号，与我们取的联系，您也可以在微信上观看我们的文章。每一个建议或是赞同都是对我们极大的鼓励！

前言

在开始学习之前，我们想要告诉您的是，本文章是对阮一峰《ECMAScript6 入门》一书中 “async 和 await” 章节的总结，如果您已掌握下面知识事项，则可跳过此环节直接进入题目练习

• 出现原由
• 什么是 async ？
• 什么是 await ？
• 如何创建和使用？

如果您对某些部分有些遗忘，👇🏻 已经为您准备好了！

学习链接

async 和 await 的学习

汇总总结

出现原由

async functions 和 await 关键字是最近添加到 JavaScript 语言里面的。它们是 ECMAScript 2017 JavaScript 版的一部分（参见 ECMAScript Next support in Mozilla ）。简单来说，它们是基于 promises 的语法糖，使异步代码更易于编写和阅读。通过使用它们，异步代码看起来更像是老式同步代码，因此它们非常值得学习。

什么是 async

async 函数是 AsyncFunction· 构造函数的实例， 并且其中允许使用await关键字。

当使用 async 关键字，置于函数声明之前，使其成为 async function 。 异步函数是一个知道怎样使用 await 关键字调用异步代码的函数。

语法

async function name([param[, param[, ... param]]]) {
   
    statements
}

参数

name ：函数名称

param ：传递给函数参数的名称

statements ：包含函数主体的表达式，可使用 await 机制

返回值

promise 这个 promise 要么会通过一个由 async 函数返回的值被解决，要么会通过一个从 async 函数中抛出的（或其中没有被捕获到的）异常被拒绝。

什么是 await

await 操作符用于等待一个Promise 对象。它只能在异步函数 async function 中使用。

await 表达式会暂停当前 async function 的执行，等待 Promise 处理完成。若 Promise 正常处理( fulfilled )，其回调的 resolve 函数参数作为 await 表达式的值，继续执行 async function。若 Promise处理异常，则抛出错误原因

语法

;[返回值] = await 表达式

表达式

一个 Promise 对象或者任何要等待的值。