ES6之async函数

148 阅读2分钟

Async函数是ES2017引入的,这一引入使得异步操作又更加方便了。其实async函数是generator的语法糖。只是把*号变成async,yield变成await。

Async函数返回一个promise对象,可以用then去添加回调函数,函数内部的return值,会成为then方法的回调参数:

async function fn() {

return 'a';

}

fn().then(res => {

console.log(res);//a

})

如果报错,会被promise的catch捕获。而且async函数返回的一定要内部所有await后面的promise对象执行完才会发生状态改变,除非遇到return或报错:

var pro1 = new Promise((resolve, reject) => {

setTimeout(() => {resolve('pro1')}, 1000);

})

var pro2 = new Promise((resolve, reject) => {

setTimeout(() => {resolve('pro2')}, 2000);

})

async function fn() {

let p1 = await pro1;

console.log(p1);//pro1

let p2 = await pro2;

console.log(p2);//pro2

return 'end';

}

fn().then(res => {

console.log(res);//end

})

会在pro1和pro2执行完毕之后输出end。可以随便测试一些报错,修改时间等去理解。

Await在正常情况下跟一个promise对象,如果不是,则直接返回该对象的结果,如果是thenable对象也等同于promise对象。如果await后面的promise对象有reject状态,则reject会被catch捕获,与return一样,直接终止async函数。如果不想中断,则需要把await放到try catch里面,或者后面的promise对象跟一个catch方法。

阮大神花了很长的篇幅去讲解了错误的处理和怎么处理两个独立的异步操作,个人觉得可以去了解,但是会觉得既然使用了async,最好是异步且有顺序关系的。如果不是这样的,那么可以直接普通方法执行。

之前也分享过async和await,这边还是要提一嘴,async的效率会高于promise,async的耗时是最长那个的耗时,promise是所有的和。

关于async更多的一些内容还是去看ECMAScript6入门,里面还有一些个人觉得要了解但是不是特别重要的内容。