ES6篇（18）--async函数

阮一峰 ES6 async函数
（1）含义
async函数是Generator函数的语法糖。使得异步操作变得更加方便。
async函数就是将Generator函数的星号替换成async，将yield替换成await。
async函数对Generator函数的改进，体现为以下四点：
①内置执行器
anync函数的执行，与普通函数一样调用，就会自动执行，然后输出结果，不像
Generator函数，需要调用next方法，或者用co模块，才能真正执行，得到最后结果。

②更好的语义
async表示函数里有异步操作，await表示紧跟在后面的表达式需要等待结果。

③更广的适用性
co模块规定，yield命令后面只能是Thunk函数或Promise对象，而async函数的await命令后面
可以是Promise对象和原始类型的值（数值，字符串和布尔值，但这时会自动转成立即resolved的Promise对象）

④返回值是Promise
async函数的返回值是Promise对象，比Generator函数的返回值是Iterator对象方便，可以用then方法指定下一步操作。
async函数完全可以看作多个异步操作，包装成的一个Promise对象，而await命令就是内部then命令的语法糖。

（2）基本用法
async函数返回一个 Promise 对象，可以使用then方法添加回调函数。当函数执行的时候，一旦遇到await就会先返回，
等到异步操作完成，再接着执行函数体内后面的语句。

（3）语法
①返回Promise对象
async函数返回一个Promise对象，async函数内部return语句返回的值，会成为then方法回调函数的参数。
async函数内部抛出错误会导致返回的Promise对象变成reject状态，抛出的错误对象会被catch方法回调函数接收到。

②Promise对象的状态变化
async函数返回的 Promise 对象，必须等到内部所有await命令后面的 Promise 对象执行完，才会发生状态改变，除非遇到return语句或者抛出错误。
也就是说，只有async函数内部的异步操作执行完，才会执行then方法指定的回调函数。

③await命令
一般情况下，await命令后面是一个Promise对象，返回该对象的结果。如果不是Promise对象，就直接返回对应的值。

另一种情况是，await命令后面是一个thenable对象（即定义了then方法的对象），那么await会将其等同于Promise对象。

await命令后面的Promise对象如果变成reject状态，则reject的参数会被catch方法的回调函数接收到。
任何一个await语句后面的Promise对象变成reject状态，那么整个async函数都会中断执行。

如果我们希望即使前一个异步操作失败，也不要中断后面的异步操作，可以将第一个await放在try...catch结构里，
这样不管这个异步操作是否成功，第二个await都会执行。当然也可以在await后面的Promise对象再跟一个catch方法。
处理前面可能出现的错误。

④错误处理
如果await后面的异步操作出错，那么等同于async函数返回的Promise对象被reject.防止出错的方法是，将其放在
try...catch代码块中。如果有多个await命令，可以统一放在try...catch结构中。

⑤使用注意点
第一点：await命令后面的Promise对象，运行结果可能是rejected，所以最好把await命令放在try...catch代码块中。
第二点：多个await命令后面的异步操作，如果不存在继发关系，最好让它们同时触发。Promise.all或是for循环

第三点：await命令只能用在async函数之中，如果用在普通函数，会报错。
第四点，async函数可以保留运行堆栈。
const a = () => {
  b().then(() => c());
};
上面代码中，函数a内部运行了一个异步任务b()。当b()运行的时候，函数a()不会中断，而是继续执行。
等到b()运行结束，可能a()早就运行结束了，b()所在的上下文环境已经消失了。如果b()或c()报错，
错误堆栈将不包括a()。

现在将这个例子改成async函数。

const a = async () => {
  await b();
  c();
};
上面代码中，b()运行的时候，a()是暂停执行，上下文环境都保存着。一旦b()或c()报错，错误堆栈将包括a()。

（4）async函数的实现原理
async函数的实现原理，就是将Generator函数和自动执行器，包装在一个函数里。

（5）与其他异步处理方法的比较
代码看原文档
Promise的写法比回调函数的写法大大改进，但是一眼看上去，代码完全都是Promise的Api，操作本身的语义反而不
容易看出来。
Generator函数写法语义比Promise写法更清晰，但是这个写法必须有一个任务运行器，自动执行Generator函数。
而Async函数的实现最简洁且符合语义，没有语义不相关代码，且不需要用户自己提供自动执行器。

（6）顶层await
根据语法，await命令只能出现在async函数内部，否则会报错。目前有个语法提案，允许在模块的顶层
独立使用await命令，这个提案的目的是借用await解决模块异步加载的问题。
例如我们需要异步加载一个模块，我们把异步操作包装在一个 async 函数里面，然后调用这个函数，
只有等里面的异步操作都执行，变量output才会有值，否则就返回undefined。
目前的解决方法，就是让原始模块输出一个 Promise 对象，从这个 Promise 对象判断异步操作有没有结束。
但是这样书写麻烦，并且要求模块的使用者，遵守额外的使用协议，按照特殊方法使用这个模块，否则就会出错。
顶层的await就是为了解决这个问题，它保证只有异步操作完成，模块才会输出值。
代码例子见原文档。