javascript 等待
exp |
JavaScript |
log |
mean |
sin
Michael Zippo
在 ES6 中引入的 Promises 允許您輕鬆編寫異步代碼，而無需處理多個回調函數。有了 Promise，就不必擔心難以編寫和維護的多級回調。
JavaScript 中還有一個特性可以讓使用 Promise 編寫異步代碼變得更加容易：異步函數/ 參加。這些 - 這些允許您編寫執行同步外觀但生成異步例程的代碼。
在本指南中，我們將討論什麼是異步/等待函數以及如何在代碼中使用它。讓我們開始
Promises: A Refresher
在我們開始討論異步/等待函數之前，我們需要回顧一下promises。一個promise 代表一個異步操作。表示將執行操作的代碼，如果操作成功，將返回一個值。否則，將向程序的其餘部分返回錯誤。
Promise 表示在創建 Promise 時未知的值。一個承諾就是這樣：一個承諾，未來的價值，Äã，Äã將返回到您的代碼。由於 promise 是一個對象，所以它必須全部大寫。
考慮這種情況。您需要從 API 檢索資源。處理您的請求需要一兩秒鐘的時間。無需讓用戶等待請求被處理，您可以將代碼移動到 Promise 以便您的程序的其餘部分可以繼續運行。
這意味著您可以繼續渲染部分提取數據時的網站 UI。一旦返回值，Promise 就會發送到您的主程序。
這是一個 Promise 的示例：
我們的代碼反饋：您的cookies已發送！當我們執行sendCookies.then()方法，我們的promise被釋放。我們的程序等待1000毫秒，然後返回值“你的cookies已經發送！”“我們的主程序
如何使用異步和等待
在函數和異步/等待中，代碼執行等待語句在其異步函數中阻塞，直到`返回一個承諾。這就是為什麼開發人員經常聲稱異步/異步等待功能，但觀察異步任務執行。
考慮以下示例：
我們的代碼反饋：您的cookies已發送！我們的 sendCookies() 函數需要 1000 毫秒才能返回值“您的 cookie 已發送”。在這種情況下，我們聲明了一個異步函數，因此我們的代碼正在等待一個 Promise 被解析或拒絕。
“async”函數關鍵字告訴我們的代碼我們想要執行一個異步在我們的函數中操作。 “expectation”這個詞 - 鍵表示我們的代碼在繼續執行我們的程序之前等待 sendCookies() 承諾返回。
異步函數總是返回一個承諾。
使用 Async 和 With Multiple Pass Wait
當您需要處理多個 Promise 時，最常使用異步/等待函數。這有時被稱為鏈接承諾。實際上，您的代碼將等待承諾返回到每個步驟，然後再繼續執行下一個步驟：
我們的代碼返回：
每一步都需要 1000 毫秒！我們的 sendCookies () 函數在我們的 ProcessOrder () 函數承諾返回之前不會執行。
異步表達式
您可以通過三種方式使用異步/等待函數。
第一個是我們在上一個例子中展示的方法：通過聲明函數。在我們的示例中，我們聲明了返回承諾的函數，因此我們使用“async”和“expectation”這兩個詞 - 鍵來執行這些函數
你也可以使用方向函數聲明一個異步函數：
此代碼返回：您的 cookie 已發送！這與我們的第一個示例相同，但我們使用箭頭函數而不是聲明 main () 函數
與您類似可以使用函數的表達式語法：.
這個返回碼：你的cookies已經發送如你所見，輸出又是 l 或它自己。唯一的區別是我們聲明函數的方式。
事實上，這個語法與我們上一個例子非常相似。我們只是使用單詞 - 鍵“function()”來代替使用繁榮函數。
沒有更好的方法來聲明異步/等待函數。這完全取決於您正在編寫的程序和您喜歡的語法。雖然可以說直接函數是最簡潔的方法，但在其他情況下聲明異步/等待函數的其他方式可能會更好。
使用異步/等待處理 Web 請求
async / 最常見的用途之一是 await 函數，它使用基於 Promise 的 API Fetch As () 來處理 Web 請求。您可以在我們的 JavaScript 初學者搜索指南中閱讀有關如何使用 fetch() 的更多信息
當我們運行我們的retrieveComments() 函數時，我們使用“等待”字鍵函數來等待”執行我們的獲取() 語句。這意味著在我們的 Web 請求被處理之前，我們的計劃的其餘部分不會繼續。事實上，該函數返回一個承諾。
哦，我希望代碼中沒有出現錯誤。但他們這樣做了，我們必須在開發人員那裡做一些計劃。異步函數，錯誤處理是使用同步的 try ... catch 來執行的。考慮這段代碼：
同樣，異步函數可以檢測語法錯誤：.
我們的代碼在嘗試檢索資源時返回：NetworkError。在這個例子中，我們使用了 try / catch 語句來檢查我們的等待方法是否返回了成功的承諾。同樣，我們的 API 無效導致我們的程序拒絕我們的承諾。發生這種情況時，“catch”會在我們的 try/catch 塊中執行，這會將我們的錯誤記錄到控制台。
