回撥函式到promise再到理解async/await

山頭人漢波發表於2022-04-16

推特上有人發了個”在 7 秒內理解 async/await“ 的視訊,地址看這裡

拆分成就是寫法的變化:回撥函式 -> promise -> async/await

js 天生支援非同步,如果你的資料依賴於非同步請求,那麼需要在它的回撥中獲取,一旦寫的多了,就形成了回撥地獄,如下圖所示

回撥函式模式

後來,ES6 出了 promise,promise 的意思是承諾,情景如下:

未婚妻:你一定要回來!

出去打戰的士兵:I promise

這樣寫法上就有個先後順序,不用再巢狀,而是串聯(但換行之後看起來也很清晰)

promise模式

promise 的問題在於,它的語境還是非同步,當 getDate 拿到資料後做事情(then)

人的慣性思維是同步,即寫就寫了,開心就開心了,怒就怒了,沒有說等五秒後再笑

所以 promise 是雖好,但可以再換個寫法——async/await

async/await模式

async/awiat 是繫結在一起的,缺一不可

const a = await getData() 其中的 a 就是請求資料拿到的結果,從理解上更符合人的思維

相關文章