ECMAScript 6 学习二async函数

1、什么是async函数

2、用法

　　2.1基本用法

3、语法

　　3.1返回promise对象

　　3.2promise状态的变化

　　3.3await命令

1、什么是async函数

async函数也是异步编程的解决方案。

async函数是对是对generator函数进行了改进。

readFile = Promise(<span style="color: #0000ff;">var gen = <span style="color: #0000ff;">function*<span style="color: #000000;"> () {
<span style="color: #0000ff;">var f1 = yield readFile('/etc/fstab'<span style="color: #000000;">);
<span style="color: #0000ff;">var f2 = yield readFile('/etc/shells'<span style="color: #000000;">);
console.log(f1.toString());
console.log(f2.toString());
};

后边的gen函数，写成async函数

asyncReadFile = async f1 = await readFile('/etc/fstab' f2 = await readFile('/etc/shells'

async函数就是将generator函数的星号（*）换成async，将yield替换成await。

 async函数对generator函数进行改进，体现以下四点。

（1）内置执行器。

generator函数的执行必须依靠执行器，而async函数自带执行器，也就是说，async函数的执行与普通函数一模一样，只要一行。

下面代码调用了asyncReadFile函数，然后就会自动执行，输出最后的结果。这个完全不像generator函数，需要调用next方法，才能得到最终的结果。

result=asyncReadFile();

（2）更好的语义

async和await，比起星号（*）和yield，语义更清楚。async表示函数中有异步操作，await表示紧跟其后的表达式需要等待结果。

（3）更广的适用性

yield命令后面只能是Thunk函数或者promise对象，而async函数的await命令后面，可以是promise对象和原始类型的值（数值，字符串和布尔值，但这等同于同步操作）

（4）返回值是promise

async函数的返回值是promise对象，执行generator函数返回一个遍历器对象（Iterator对象）方便多了，也就是说，async函数可以看做是多个异步操作，包装成一个promise对象，而await命令是内部then命令的语法糖。

2、用法

2.1基本用法

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

举一个栗子

Promise((resolve) =>async <span style="color: #0000ff;">function<span style="color: #000000;"> asyncPrint(value,ms) {
await timeout(ms);
console.log(value);
}

asyncPrint('hello world',5000);

上面代码指定5秒后输出hello world。

 async函数多种使用形式

async <span style="color: #008000;">//<span style="color: #008000;">函数表达式
const foo = async <span style="color: #0000ff;">function<span style="color: #000000;"> () {}

<span style="color: #008000;">//<span style="color: #008000;">对象的方法
let obj =<span style="color: #000000;"> { async foo() {} }
obj.foo().then(...)

<span style="color: #008000;">//<span style="color: #008000;">箭头函数
const foo = async () =><span style="color: #000000;"> {};

<span style="color: #008000;">//<span style="color: #008000;">class方法
<span style="color: #000000;">class Storage {
constructor() {
<span style="color: #0000ff;">this.cachePromise = caches.open('avatars'<span style="color: #000000;">);
}

async getAvatar(name) {
const cache = await <span style="color: #0000ff;">this<span style="color: #000000;">.cachePromise;
<span style="color: #0000ff;">return cache.match(/avatars/<span style="color: #000000;"&gt;${name}.jpg);
}
}

3、语法

 async函数的语法规则总体上比较简单，难点是错误处理机制。

3.1返回的promise对象

async函数返回的是promise对象。

async函数内部return语句返回值，会成为then方法回调函数的参数

async 'hello world'f().then(v => console.log(v))

上面代码中，函数f内部return 命令返回值，会被then方法回调函数接收到。输出“hello world”。

async函数内部抛出的错误，会导致返回的promise对象变成reject状态。抛出的错误对象会被catch方法回调函数接收到。

3.2promise对象状态变化 

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

举个栗子

async == html.match(/