ES6 Async/Await函數

前言

async-awai

t是

promise

和

generato

r的文法糖。隻是為了讓我們書寫代碼時更加流暢，當然也增強了代碼的可讀性。簡單來說：

async-await

是建立在

promise

機制之上的，并不能取代其地位。

基本文法

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傳回值

let asyncResult = await awaitPromise；
           

asyncResult

不用

.then()

操作就可以擷取

resolve()

的值

    2、隻有當async函數中有

return

的時候，才會傳回

Promise對象

，這時

.then()

才有效果

    3、

await

指令後面是一個

Promise對象

，也可以是

原始類型

的值

        當

await

函數是數值、字元串和布爾值等原始類型時，但這時等同于同步操作。

async function asyncBasic() {
    let asnum = await setTimeout(()=>{
        num++;
    },5000)
    await num++;
    return num;
}
           

        這種寫法setTimeout是不起作用的

    4、當存在多個

await

時，隻要有一個await後的Promise變成

reject

，則後面的

await

将不再執行。

        可以使用

catch

進行錯誤的捕獲；或者把await指令放在

try...catch

代碼塊中。

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異步操作完成後進行操作

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寫法

let allPromise = new Promise((resolce,reject)=>{
    promise01.then(function(
    	return promise02
    ){}).then(function(){
    	return promise03
    }).then(function(){
    	resolve(“success”);
    })
})
allPromise.then(()=>{

})
           

    async-await函數寫法

async function asyncPromise (){
	await promise01; 
	await promise02;
	await promise03;
	return “success”

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

});