# 第二週：非同步

## 關鍵知識：

- Axios / 非同步
- **API 說明**
- This
- Vue 的 Create → Vue 的指令練習

## 主題一：非同步與 Axios

> 哪邊會用到？課程中會串接大量的 API，其中都會不斷地套用非同步與 Promise 的概念。

知識點：事件佇列

- JS 是屬於同步語言，基本上都是依序執行
- 但非同步的行為會先放在事件佇列內，等所有程式執行完後才執行

Promise

- 過去非同步可能會使用 callback 進行串接
- 非同步程式碼更有一致的結構性
- then, catch 用法說明
- 鏈接


## 主題二：課程 API 說明

> 哪邊會用到？從第二週至課程結束，都會在本課程 API 中建立、讀取、修改資料內容，並且完成一個作品。


申請：[https://vue3-course-api.hexschool.io/](https://vue3-course-api.hexschool.io/)

API 文件：[https://hexschool.github.io/vue3-courses-swaggerDoc/](https://hexschool.github.io/vue3-courses-swaggerDoc/)

MDN 上的 Cookie：[https://developer.mozilla.org/zh-CN/docs/Web/API/Document/cookie](https://developer.mozilla.org/zh-CN/docs/Web/API/Document/cookie)

axios: [https://github.com/axios/axios](https://github.com/axios/axios)

- API 運作概念
- 管理者與一般用戶的差異
- Token 與驗證
- 串接示範

## 主題三：關於 This

> 哪邊會用到？Vue Options API 是基於物件的結構進行開發，因此會使用到許多 this 來進行元件內的資料、方法運用。

#### This

- 關於 this 的概念
- this 會出現在哪？
- this 與箭頭函式
-


#### Vue 與 this 的關係

- Vue 與 this 的關係
- v-on 觸發 methods

## 作業說明：
- 本週作業：
- <a href="https://rpg.hexschool.com/training/39/task?type=detail&id=371" target="_top">第二週主線任務：RESTful API 串接</a>
- 團隊任務：
- https://rpg.hexschool.com/training/39/show?embedhm=S_rH5NvyShuFfSVV2t1fPQ
- 課後測驗（團隊、個人均可參加）：
- 填寫位置：https://docs.google.com/spreadsheets/d/1mz3yb8wwM316llf4w9PoDlmeb0iMmuVxBZRmf_MzNvo/edit#gid=0
- 題目：https://casper-wang.notion.site/607435b44b3d4221b54fefca0c55ec99?pvs=4
- 下週預習：
- 指令的練習本：[https://hackmd.io/@hexschool/S1DJeKTdL/%2FRhud3_1PR9qv1RJyMfwUmA](https://hackmd.io/@hexschool/S1DJeKTdL/%2FRhud3_1PR9qv1RJyMfwUmA)
- 指令章節影片：https://courses.hexschool.com/courses/vue-2021211/lectures/

### 關於課後測驗

1. 每個人、團隊均可以新增自己的列，並且填寫自己認為的答案（別過度相信別人寫的，有時候別人寫的也可能是錯的）
2. 如果擔心自己受他人影響，可以先將答案寫在別的地方，再謄寫過來
3. **請勿調整他人的答案**
4. **填寫時間僅到隔週五中午前**，中午後隨時會被鎖定，無法再次編輯答案
6. 試算表有使用人數限制，請避免在最後一天才上線填寫，可能會因為人數偏多導致無法存取
7. 如果是團隊，建議使用 Zoom 或任何視訊工具討論答案為何，透過彼此互動增加印象
8. **得分欄會自動計算分數**，講師補上答案後會自動進行計算（填充題可能會因為部分字詞格式，導致沒有正確得分）