ES6 Async/Await函数

103 阅读 0 评论 68 点赞

我是靠谱客的博主醉熏康乃馨，这篇文章主要介绍ES6 Async/Await函数，现在分享给大家，希望可以做个参考。

前言

async-await是promise和generator的语法糖。只是为了让我们书写代码时更加流畅，当然也增强了代码的可读性。简单来说：async-await 是建立在 promise机制之上的，并不能取代其地位。

基本语法

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
let awaitPromise = new Promise((resolve,reject)=>{
	…
	resolve(“successful”);
})
async function basicDemo() {
    let result = await Math.random();
    let asyncResult = await awaitPromise；
    console.log(result);
    return asyncResult
}

basicDemo().then((value)=>{
	console.log(value);
});
// successful

注意事项及特性

1、直接获取Promise返回值

复制代码

1
2
let asyncResult = await awaitPromise；

asyncResult不用.then()操作就可以获取resolve()的值

2、只有当async函数中有return的时候，才会返回Promise对象，这时.then()才有效果

3、await命令后面是一个Promise对象，也可以是原始类型的值

当await函数是数值、字符串和布尔值等原始类型时，但这时等同于同步操作。

复制代码

1
2
3
4
5
6
7
8
async function asyncBasic() {
    let asnum = await setTimeout(()=>{
        num++;
    },5000)
    await num++;
    return num;
}

这种写法setTimeout是不起作用的

4、当存在多个await时，只要有一个await后的Promise变成reject，则后面的await将不再执行。

可以使用catch进行错误的捕获；或者把await命令放在try...catch代码块中。

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
async function basicDemo() {
	try{
	    let result = await Math.random();
	    let asyncResult = await awaitPromise；
	    console.log(result);
	    return asyncResult
    }
    catch（err）{
		console.lot(err);
	}
}

async-await函数最常见用法

使用多个Promise异步操作完成后进行操作

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13
var promise01  = new Promise(function(resolve,reject){
	...
	resolve();
})
var promise02  = new Promise(function(resolve,reject){
	...
	resolve();
})
var promise03  = new Promise(function(resolve,reject){
	...
	resolve();
})

Promise写法

复制代码

1
2
3
4
5
6
7
8
9
10
11
12
13
let allPromise = new Promise((resolce,reject)=>{
    promise01.then(function(
    	return promise02
    ){}).then(function(){
    	return promise03
    }).then(function(){
    	resolve(“success”);
    })
})
allPromise.then(()=>{

})

async-await函数写法

复制代码

1
2
3
4
5
6
7
8
9
10
11
async function asyncPromise (){
	await promise01; 
	await promise02;
	await promise03;
	return “success”

}
asyncPromise().then(()=>{

});