async 和 await 是一種更加優(yōu)雅的異步編程解決方案，是Promise 的拓展。

在我們處理異步的時(shí)候，比起回調(diào)函數(shù)，Promise的then方法會(huì)顯得較為簡潔和清晰，但是在處理多個(gè)彼此之間相互依賴的請(qǐng)求的時(shí)候，就會(huì)顯的有些繁瑣。這時(shí)候，用async/await更加優(yōu)雅。

我們知道 JavaScript 是單線程的，使用 Promise 之后可以讓我們書寫異步操作更加簡單，而 async 是讓我們寫起 Promise 像同步操作。

基本用法

前面添加了async的函數(shù)在執(zhí)行后都會(huì)自動(dòng)返回一個(gè)Promise對(duì)象：

async function foo() {return 'hello' } console.log(foo()) // Promise 對(duì)象

await后面需要跟異步操作，不然就沒有意義，而且await后面的Promise對(duì)象不必寫then，因?yàn)閍wait的作用之一就是獲取后面Promise對(duì)象成功狀態(tài)傳遞出來的參數(shù)。

function timeout() {return new Promise(resolve => {setTimeout(() => {console.log(1)resolve('success')}, 1000)}) }async function foo() {let res = await timeout()console.log(res)console.log(2) } foo() // 1 success 2

在async函數(shù)中使用await，那么await這里的代碼就會(huì)變成同步的了，意思就是說只有等await后面的Promise執(zhí)行完成得到結(jié)果才會(huì)繼續(xù)下去，await就是等待。

應(yīng)用

按順序讀取a.json、b.json、c.json，使用async/await該如何實(shí)現(xiàn)：

function request(url) {return new Promise(resolve => {ajax(url, res => {resolve(res)})}) } async function getData() {let res1 = await request('static/a.json')console.log(res1)let res2 = await request('static/b.json')console.log(res2)let res3 = await request('static/c.json')console.log(res3) } getData()

await 只能在 async 標(biāo)記的函數(shù)內(nèi)部使用，單獨(dú)使用會(huì)觸發(fā) Syntax error。

總結(jié)

以上是生活随笔為你收集整理的【ES8(2017)】async / await的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。