玩轉異步 JS :async/await 簡明教程(附視頻下載)

課程介紹

在軟件開發領域,簡潔的代碼 => 容易閱讀的代碼 => 容易維護的代碼,而 ES2017 中的 async/await 特性能讓咱們編寫出相比回調地獄和 Promise 鏈式調用更直觀、更容易理解的代碼,await 關鍵字接收一個 Promise,等待代碼執行,直到 Promise 狀態變爲 resolved 或者 rejected,這種特性能讓咱們的異步代碼閱讀起來更像是同步代碼。javascript

本課程共 8 小節 20 分鐘,將會從編寫簡單的 async/await 函數開始,用實例帶領你們探索 async/await 實戰的方方面面,好比如何結合 Promise 和 await 關鍵字?如何定義不一樣類型的 async 函數?如何安全的使用 async/await,即處理錯誤?如何讓多個 await 串行或並行?如何在循環中正確使用 await?前端

適用人羣

  • [required] 具有 JS 基礎知識,知道如何運行 Node.js 腳本;
  • [required] 知道 Callback、Promise 等異步處理概念;
  • [optional] 指望學習新的異步特性,編寫更簡潔易懂易維護的代碼;
  • [optional] 指望不斷打磨本身的 JS 技能,讓本身變得更值錢;

內容目錄

1. 編寫第一個 async/await 函數

手把手教你把發起 HTTP 請求並解析響應的代碼改寫成 async/await 風格,讓你學會 async/await 的基本語法。java

2. 將 async 函數用在 Promise 鏈中

帶你探索如何在 Promise 鏈中像使用其餘 Promise 同樣無縫使用 async 函數。node

3. 把任意類型的函數轉成 async 風格

實例演示如何將任意函數寫成 async 風格,包括函數聲明、函數表達式、箭頭函數、類方法、對象方法等。git

4. 處理 async 函數中的錯誤

不一樣於 Promise 中的 .catch() 錯誤處理機制,在 async 函數中,咱們須要使用 try/catch 結構來恰當的處理錯誤。github

5. 正確處理多個 await 操做的並行串行

學會經過移動 await 關鍵詞的位置實現多個 await 操做串行或者並行,而且用數據證實讓多個異步操做並行的性能優點。web

6. 使用 Promise.all() 讓多個 await 操做並行

學會使用 ES2015 中的解構和 Promise.all() 實現多個異步操做的並行,很是適合須要同時發起多個請求的情形,代碼可讀性不打折扣。shell

7. 結合 await 和任意兼容 .then() 的代碼

await 操做符並不單單侷限於 ES2015 的 Promise,能夠和任意兼容 .then() 方法的代碼使用,經過實例學會如何與流行的 Promise 庫結合使用。promise

8. 在 for 循環中正確的使用 await

理解 for 循環中 await 不一樣寫法帶來的性能影響,以及改進的方法。安全

源碼連接

代碼倉庫:wangshijun/course-javascript-async-await

運行方法(請確保系統中安裝了 Node.js):

git clone https://github.com/wangshijun/course-javascript-async-await.git
cd course-javascript-async-await
node xxx.js複製代碼

上面的 xxx.js 對應每節課程的源碼,列表以下:

  1. 編寫第一個 async/await 函數
  2. 將 async 函數用在 Promise chain 中
  3. 把任意類型的函數轉成 async 風格
  4. 處理 async 函數中的錯誤
  5. 正確處理多個 await 操做的並行串行
  6. 使用 Promise.all() 讓多個 await 操做並行
  7. 結合 await 和任意兼容 .then() 的代碼
  8. 在 for 循環中正確的使用 await

運行環境

  • Node.js v8.6.0
  • VSCode v1.17.1 + Vim

參考資料

視頻下載

關注《前端週刊》微信公衆號,回覆 course-async-await 便可獲取高清視頻教程下載地址。

題外話

最後,可能你有同窗會問,我爲何要作這個公開課?接下來的計劃是什麼?請閱讀很久不見,我總感受欠你點什麼

相關文章
相關標籤/搜索