JavaScirpt - async/await


Posted by urlun0404 on 2022-05-09

看到一篇 async/await 解釋得很清楚(又很短)的文章,也是面試被問過的內容,趕快翻中筆記重點一下XDDDD


async/await

async 函式 (function) 代表要讓這個函式作 asynchronous (非同步/異步) 處理,而且(!) 只會回傳 Promise 物件

await 關鍵字可用來等待函式完成某件事情、並 能接收函式回傳的Promise或其他結果

asyncawait 有幾個需要注意的用法如下:

  1. async 函式只會回傳 Promise 物件 ─ 即使不是在 async 函式裡面 return 一個 Promise 物件,如回傳JSON,這個JSON也會被包成 Promise 物件再丟出去。
  2. await 只能在 async 函式裡面使用。
  3. await 可接收 任何 函式回傳的結果 ─ 意思是沒有強制使用await關鍵字只能接收由 async 函式回傳的結果,也能接收普通函式回傳的東西。

如果 await 接收 async 函式回傳的結果,接收到的會是 Promise 物件; 但是,如果 await 接收普通函式回傳的結果,則接收到的東西型別會跟這個函式所回傳結果的型別相同。

意思是如果儲存某個 await 所接收的普通函式回傳結果,該函式回傳 string 會接收到 string;回傳 number 就會接收到 number,以此類推。

Error Handling

可以用 try...catch 來處理回傳的 Error 物件。

const app = async (url) => {
    try{
        console.log("Try to get the result...");
        const result = await fetch(url);
        console.log(result)            // 如果有成功的話
    } catch (err) {
        console.error(err.message);   // 失敗時候的錯誤處理
    }
}

app("a API endpoint");


原文作者提到他有發布跟asynchronous相關的系列文,蠻值得參考的!


References


#javascript #asynchronous







Related Posts

【leetCode】- 206. Reverse Linked List

【leetCode】- 206. Reverse Linked List

常用命令列指令

常用命令列指令

物件屬性描述器 Property Descriptor(一)

物件屬性描述器 Property Descriptor(一)


Comments