async函式是generator的乙個語法糖,使用async函式實際上返回的是乙個promise物件。如下:
async function
fn()
// 或者
const fn = async () =>複製**
在宣告函式的時候,前面加上關鍵字async
即可。我們可以使用console.log
列印出上邊宣告的函式fn,結果如下:
console.log(fn());
// result
promise = 複製**
顯然,fn的執行結果其實就是乙個promise物件,因此我們可以使用then來處理後續邏輯。
fn().then(res =>)複製**
await的是含義是等待。意思是**需要等待await後面的函式執行完成並且有了返回結果之後,才繼續執行後續的**,以此來實現同步的效果。 需要注意的是,await
關鍵字只能在async
函式中使用,並且await
後面的函式執行後必須返回乙個promise
物件才能實現同步的效果。
當我們使用乙個變數去接收await的返回值時,該返回值是promise中resolve出來的值(也就是promisevalue)。
// 定乙個返回promise物件的函式
function
f1(),1000);
})}function
f2(),1000);
})}function
f3(),1000);
})}const foo = async () =>
foo();
// 執行結果:
// 1
// 2
// 3複製**
執行這個例子我們可以看出,當在async
函式中,執行遇到await
時,就會等待await
後面的函式執行完畢,而不會直接執行後續程式
如果我們直接使用promise的話,想要實現以上的結果,就不得不把後續的邏輯寫在then方法中。
function
f1(),1000);
})}function
f2(),1000);
})}function
f3(),1000);
})}const foo = () =>).then(t =>).then(t =>);
}foo();複製**
異常處理
在promise中,我們知道是通過catch的方式來捕獲異常。而當我們使用async時,則是通過try/catch
來捕獲異常。
function
fn(),1000)
})}const foo = asyn () =>catch(e)
}foo();複製**
如果有多個await函式,那麼只會返回第乙個捕獲到的異常。
function
f1(),1000)
})}function
f2(),1000)
})}function
f3(),1000)
})}const foo = async () =>catch(e)
}foo();複製**
如果我們直接使用promise,實現以上效果,**應該寫成如下:
function
f1(),1000)
})}function
f2(),1000)
})}function
f3(),1000)
})}const foo = () =>).then(() =>).catch(err =>)
}foo();複製**
很顯然,如果使用async/await的話,**結構會更加簡潔,邏輯也更加清晰,更利於專案中的開發以及維護。
async await使用的要點
async await的使用 1 如果乙個方法標註了async,則其返回值只能是 void,task,task三者之一 2 如果非同步方法中沒有await,那麼這個方法將會以同步方式執行 3 單個async方法中可以擁有多個await 4 當遇到await表示式時,呼叫執行緒將會掛起,知道await...
async await的正確使用
經過一段時間的使用,對於async await的正確使用,我總結了一下幾點 必須使用try.catch。確保正確的流程控制。123 4567 891011 1213 1415 1617 1819 2021 2223 2425 2627 2829 resolve function getdata 10...
使用async await 總結
async await 迴圈並行處理 同步 同一執行緒之中,順序完成不同的操作,是一種阻塞模式 後乙個請求操作需要等待前乙個操作完成之後,才能發出。非同步 需要開啟不同的執行緒,是非阻塞模式。同步類似於打 而非同步相當於發簡訊。傳送請求獲取天氣非同步操作,利用node fetch完成請求 const...