JS async 函數的含義和用法實例總結
本文實例講述了JS async 函數的含義和用法。分享給大家供大家參考,具體如下:
學習老師最后一篇文章并做總結,
前面我們認識了各種異步編程方式:回調函數,Promise對象,Generator函數,
再到兩種自動執行方式:Thunk,co
好像我們為了更好的解決異步編程做了很多事情,
但是這也說明了一個問題
就是目前仍是的異步編程都有或多或少的問題,才導致我們要找對應的解決方案
今天我們仍是最后的大招:async
這個關鍵字在哪里見到來著?
我們可以給script標簽添加 async 屬性來異步執行腳本。
ajax 可以通過配置 async 來設置同步/異步請求
今天我們仍是一種新的使用方式: async 函數
還是參考前面讀取文件的例子:
var gen = function* (){ var f1 = yield readFile(’/etc/fstab’); var f2 = yield readFile(’/etc/shells’); console.log(f1.toString()); console.log(f2.toString());};
我們對他做了兩種解決方案, Thunk 和 co
這兩種方式需要引入單獨的模塊,來實現自動執行器。
并且對 yield 的返回結果有嚴格要求。
async 函數很好的解決了這個問題。
先看看async函數如何實現上面的代碼:
var asyncReadFile = async function (){ var f1 = await readFile(’/etc/fstab’); var f2 = await readFile(’/etc/shells’); console.log(f1.toString()); console.log(f2.toString());};
把之前的 * 替換成了 async ,yield 替換成了 await,僅此而已
我們不需要在去寫 Thunk 和 co 了,因為 async 自帶執行器。
我們也不需要去限制 await 后面的返回值,因為 async 會自己識別,
如果是 Promise 對象就異步處理,原始類型則同步處理
最復雜的兩處代碼 async 都幫我們實現了。
但是萬變不離其宗,再怎么改變,其實內里還是一樣的
async 函數其實是將前文里的 Generator 函數和自動執行函數包裝在一塊
只是減少了我們使用上的復雜度,實際的邏輯一點沒少。
使用方式也和之前 co 的使用方式類似。
所以我們最后羅列一下使用async時需要注意的點
await 命令后面的Promise對象可能拋出異常,所以最好catch一下異常 await 命令只能用在async函數內部,用在其他位置會報錯 可以使用Promise.all將任務并發執行至此,老師的異步編程四部曲就學習完了。
再次聲明,本博客內的文章只適用個人學習使用,不允許任何形式的轉載,
如需轉載,請移步阮一峰老師的博客。
最后附上原文地址:async 函數的含義和用法
感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運行工具:http://tools.jb51.net/code/HtmlJsRun測試上述代碼運行效果。
更多關于JavaScript相關內容可查看本站專題:《JavaScript常用函數技巧匯總》、《javascript面向對象入門教程》、《JavaScript錯誤與調試技巧總結》、《JavaScript數據結構與算法技巧總結》及《JavaScript數學運算用法總結》
希望本文所述對大家JavaScript程序設計有所幫助。
相關文章: