資訊專欄INFORMATION COLUMN
摘要：由于我們沒有，或者的結(jié)果，所以我們無法對它做出任何反應。因為我們等待了的返回值，所以它的會被返回并且被拋出，的代碼塊就會執(zhí)行。但無論如何，如果沒有報錯而是順利執(zhí)行，我們依舊無法對它的返回值做任何事情。
原文地址：await vs return vs return await
作者：Jake Archibald
當編寫異步函數(shù)的時候，await,return,return await三者之間有一些區(qū)別，從中選取正確的方式是很重要的。
我們從下面這個異步函數(shù)開始：
async function waitAndMaybeReject(){
// 等待1秒鐘
await new Promise(resolve => setTimeout(resolve, 1000));
// 拋一枚硬幣
const isHeads = Boolean(Math.round(Math.random()));
if(isHeads) return "yay";
throw Error("Boo!");
}
上面的函數(shù)會等待1秒鐘后返回一個promise，然后有50%的機會成功返回yay或者拋出一個error。讓我們用幾種稍微不同的方式使用它。
直接調(diào)用async function foo() {
try{
waitAndMaybeReject();
}catch(e){
return "caught";
}
}
在此處，如果調(diào)用了foo，返回的promise的狀態(tài)始終都是resolved，值也永遠是undefined，而且沒有等待。
由于我們沒有await，或者return waitAndMaybeReject（）的結(jié)果，所以我們無法對它做出任何反應。像這樣的代碼通常是錯誤的。
async function foo(){
try{
await waitAndMaybeReject();
}catch(e){
return "caught";
}
}
在此處，如果調(diào)用了foo，返回的promise將始終等待1秒鐘，然后結(jié)果要么狀態(tài)為resolved，值為undefined，要么狀態(tài)為resolved，值為"caught"。
因為我們等待了waitAndMaybeReject()的返回值，所以它的rejection會被返回并且被拋出（throw），catch的代碼塊就會執(zhí)行。但無論如何，如果waitAndMaybeReject()沒有報錯而是順利執(zhí)行，我們依舊無法對它的返回值做任何事情。
async function foo() {
try {
return waitAndMaybeReject();
}
catch (e) {
return "caught";
}
}
在此處，如果調(diào)用了foo，返回的promise將始終等待1秒鐘，然后結(jié)果要么是狀態(tài)為resolved，值為"yaa"，要么是狀態(tài)是reject，拋出錯誤Error("Boo!")。
通過return waitAndMaybeReject()這行代碼，我們直接傳遞了它的返回結(jié)果，所以我們的catch代碼塊永遠不會執(zhí)行。
如果你想在try代碼塊中得到帶有正確返回值的resolved狀態(tài)，在catch中捕獲異常，那么正確的選擇就是return await。
async function foo() {
try {
return await waitAndMaybeReject();
}
catch (e) {
return "caught";
}
}
在此處，如果調(diào)用foo，返回的promise將始終等待1秒鐘，然后結(jié)果要么是狀態(tài)為resolved，值為"yay"，要么是狀態(tài)為resolved，值為"caught"
因為我們等待了waitAndMaybeReject()的結(jié)果，所以它的異常rejecttion會被返回并且被拋出（throw）,catch的代碼塊就會執(zhí)行。如果waitAndMaybeReject()順利執(zhí)行沒有報錯，就返它的結(jié)果。
如果對上面的內(nèi)容還是覺著困惑，那么將代碼拆分成兩個步驟來看可能會比較好理解：
async function foo() {
try {
// 等待 waitAndMaybeReject() 的結(jié)果來解決,
// 并且將 fullfill 的值賦給 fullfilledValue:
const fulfilledValue = await waitAndMaybeReject();
// 如果 waitAndMaybeReject() reject了，
// 我們的代碼就會拋出異常，并且進入 catch 代碼塊的邏輯。
// 否則，這里的代碼就會繼續(xù)運行下面的語句:
return fulfilledValue;
}
catch (e) {
return "caught";
}
}
Note: 在try/catch之外的代碼塊中執(zhí)行return await是多余的(如前所述，直接return即可)，甚至Eslint還專門有規(guī)則來檢測這種場景，但是在try/catch代碼塊之內(nèi)，Eslint就允許這種操作。
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/99336.html
摘要：異步流程管理說白了就是為了解決回調(diào)地獄的問題。對象代表一個異步操作，有三種狀態(tài)進行中已成功和已失敗。如果改變已經(jīng)發(fā)生了，你再對對象添加回調(diào)函數(shù)，也會立即得到這個結(jié)果。執(zhí)行函數(shù)后返回的是一個遍歷器對象，可以依次遍歷函數(shù)內(nèi)部的每一個狀態(tài)。 javascript -- 深度解析異步解決方案 高級語言層出不窮, 然而唯 js 鶴立雞群, 這要說道js的設(shè)計理念, js天生為異步而生, 正如布道...
摘要：本文討論地址閱讀時間大概分鐘和有很多容易被忽視的不同之處。首先定義一個異步函數(shù)等待秒函數(shù)等待秒鐘，然后有一半的概率返回，一半的概率拋出異常。這個是最符合我們預期的寫法。 dev-reading/fe 是一個閱讀、導讀、速讀的 repo，不要依賴于 dev-reading/fe 學習知識。本 repo 只是一個快速了解文章內(nèi)容的工具，并不提供全文解讀和翻譯。你可以通過本平臺快速了解文章里...
摘要：對于，除非使用箭頭函數(shù)，它的回調(diào)函數(shù)的將會變化。使用測試下面的代碼，結(jié)果如下打印打印要點使用的規(guī)則要求所有回調(diào)函數(shù)必須使用箭頭函數(shù)。 譯者按： JS 騷操作。 原文：For vs forEach() vs for/in vs for/of in JavaScript 譯者: Fundebug 本文采用意譯，版權(quán)歸原作者所有 我們有多種方法來遍歷 JavaScript 的數(shù)組或者...
摘要：的科學定義是或者，它的標志性原語是。能解決一類對語言的實現(xiàn)來說特別無力的狀態(tài)機模型流程即狀態(tài)。容易實現(xiàn)是需要和的一個重要原因。 前面寫了一篇，寫的很粗，這篇講講一些細節(jié)。實際上Fiber/Coroutine vs Async/Await之爭不是一個簡單的continuation如何實現(xiàn)的問題，而是兩個完全不同的problem和solution domain。 Event Model 我...
摘要：如果是你是高級或者初級開發(fā)人員，了解它的基本概念非常重要。由于是基本類型，因此的值等于的值，并且可以認為此時與完全不同。展開運算符可用于提取數(shù)組的各個元素。函數(shù)本身返回從數(shù)組中刪除的項。如果未指定結(jié)束位置，則返回數(shù)組的其余部分。 譯者：前端小智 原文：hackernoon.com/12-javascri… JavaScript 是一種復雜的語言。如果是你是高級或者初級 JavaScript...
閱讀 2844·2021-09-10 10:50
閱讀 2199·2019-08-29 16:06
閱讀 3205·2019-08-29 11:02
閱讀 1104·2019-08-26 14:04
閱讀 2816·2019-08-26 13:24
閱讀 2311·2019-08-26 12:16
閱讀 557·2019-08-26 10:29
閱讀 3104·2019-08-23 18:33
