1. 什么是async

ES7 中的 async / await 讓多個(gè)異步 promise 協(xié)同工作起來(lái)更容易竖螃。如果要按一定順序從多個(gè)數(shù)據(jù)庫(kù)或者 API 異步獲取數(shù)據(jù)李破，你可能會(huì)以一堆亂七八糟的 promise 和回調(diào)函數(shù)而告終构资。而 async / await 結(jié)構(gòu)讓我們能用可讀性強(qiáng)、易維護(hù)的代碼更加簡(jiǎn)潔地實(shí)現(xiàn)這些邏輯

async顧名思義是“異步”的意思粤蝎，async用于聲明一個(gè)函數(shù)是異步的碰缔。而await從字面意思上是“等待”的意思，就是用于等待異步完成阱缓。并且await只能在async函數(shù)中使用

2. 為什么要使用async

通常async非凌、await都是跟隨Promise一起使用的。async返回的都是一個(gè)Promise對(duì)象同時(shí)async適用于任何類型的函數(shù)上荆针。這樣await得到的就是一個(gè)Promise對(duì)象(如果不是Promise對(duì)象的話那async返回的是什么 就是什么)敞嗡；

await得到Promise對(duì)象之后就等待Promise接下來(lái)的resolve或者reject

3. 怎么使用async

案例1 ：

async function testAsync() {

? ? ? ? ? ? ? const response? = await new Promise((resolve, reject) => {

? ? ? ? ? ? ? ? ? setTimeout(resolve("this is async"),2000);

? ? ? ? ? ? ? });

? ? ? ? ? ? ? console.log(response);

};

testAsync();

async、await串行并行處理

串行：等待前面一個(gè)await執(zhí)行后接著執(zhí)行下一個(gè)await航背，以此類推

async function fun1() {?

? ? ? ? ? ? ? ? return new Promise((resolve, reject) => {

? ? ? ? ? ? ? ? ? ? setTimeout(resolve,3000);

? ? ? ? ? ? ? ? });

};

async function test(){

? ? ? ? ? ? ? ? console.log('開(kāi)始執(zhí)行', new Date().toString());

? ? ? ? ? ? ? ? await fun1();

? ? ? ? ? ? ? ? console.log('結(jié)束執(zhí)行', new Date().toString());

}

并行：將多個(gè)promise直接發(fā)起請(qǐng)求（先執(zhí)行async所在函數(shù)）喉悴，然后再進(jìn)行await操作。

async function asyncAwait(str) {

? ? ? ? ? ? ? ? return await new Promise((resolve) => {

? ? ? ? ? ? ? ? ? ? setTimeout(resolve(str), 1000);

? ? ? ? ? ? ? ? })

}

? ? ? ? const parallel = async () => { //并行執(zhí)行

? ? ? ? ? ? ? ? console.time('parallel')

? ? ? ? ? ? ? ? const parallel1 = asyncAwait('async1');

? ? ? ? ? ? ? ? const parallel2 = asyncAwait('async2')

? ? ? ? ? ? ? ? //直接打印

? ? ? ? ? ? ? ? console.log(await parallel1)

? ? ? ? ? ? ? ? console.log(await parallel2)

? ? ? ? ? ? ? ? console.timeEnd('parallel');

? ? ? ? ? ? ? ? };

? ? ? ? ? ? ? ? parallel();

4. 請(qǐng)求失敗的處理方式

使用異步請(qǐng)求肯定會(huì)有請(qǐng)求失敗的情況玖媚，async返回的是一個(gè)Promise對(duì)象箕肃。既然是返回一個(gè)Promise對(duì)象的話那處理當(dāng)異步請(qǐng)求發(fā)生錯(cuò)誤的時(shí)候我們就要處理reject的狀態(tài)了，為了保持代碼的健壯性使用async今魔、await的時(shí)候我們使用try catch來(lái)處理錯(cuò)誤勺像。

async function catchError() {

? ? ? ? ? ? ? ? try {

? ? ? ? ? ? ? ? ? ? const asyncError = await new Promise((resolve, reject) => {

? ? ? ? ? ? ? ? ? ? ? ? setTimeout(reject('處理異步請(qǐng)求失敗'),2000);

? ? ? ? ? ? ? ? ? ? });

? ? ? ? ? ? ? ? } catch (error) {

? ? ? ? ? ? ? ? ? ? console.log(error);

? ? ? ? ? ? ? ? }

};

catchError();