# JS: async/await

看到一篇 async/await 解釋得很清楚(又很短)的[文章](https://blog.greenroots.info/javascript-async-and-await-in-plain-english-please)，也是面試被問過的內容，趕快翻中筆記重點一下XDDDD
<br/>

-----
## async/await
`async` 函式 (function) 代表要讓這個函式作 _**asynchronous**_ (非同步/異步) 處理，**而且(!) 只會回傳 `Promise` 物件**。

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

** `async` 和 `await` 有幾個需要注意的用法如下：**

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`，以此類推。
<br/>

## 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");
```
<br/>

原文作者提到他有發布跟asynchronous相關的[系列文](https://blog.greenroots.info/series/javascript-promises)，蠻值得參考的!
<br/>


---
References
- [JavaScript async and await - in plain English, please](https://blog.greenroots.info/javascript-async-and-await-in-plain-english-please)