---
# System prepended metadata

title: "\U0001F3C5 Day 2"
tags: [Node.js 直播班 - 2022 春季班]

---

---
tags: Node.js 直播班 - 2022 春季班
---
# 🏅 Day 2



### 非同步概念、使用 Promise


### 使用 Promise 簡介
Promise 是一個物件，代表一個即將完成或失敗的非同步操作，以及回傳的值
建立 Promise 的寫法為：

```javascript=
function example() {
  new Promise((resolve, reject) => {
  // 執行一些非同步作業，最終呼叫:
  //
  // resolve(someValue); // 實現
  // 或
  // reject("failure reason"); // 拒絕
  } )
} 

```
建立好 Promise 後，執行此函式就可以在完成 Promise 時使用 `.then()` 接收回傳的 Promise 物件，以及使用 `.catch()` 接收錯誤，因 Promise 可以用鍊式寫法接收上一個 Promise 的回傳值，不需像使用 callback function 一層包一層，因此可以提昇易讀性
```javascript=
example()
  .then(data => 
    useData(data)
  )
  .catch(error =>
    console.log(error)
  )
```

### 參考資源
[使用 Promises 來處理非同步操作](https://developer.mozilla.org/zh-TW/docs/Learn/JavaScript/Asynchronous/PromisesTW/docs/Learn/JavaScript/Asynchronous/Introducing)
[JavaScript Promise 全介紹 | 卡斯伯 Blog - 前端，沒有極限](https://www.casper.tw/development/2020/02/16/all-new-promise/)
[Node.js 非同步技巧 - Promise、Async、Await](https://courses.hexschool.com/courses/1670869/lectures/38886982)(章節影片)

### 題目（將答案寫在 CodePen 並提交至回報區）
請嘗試使用 Promise 的鍊式寫法 `.then()` `.catch()` 執行以下函式
**執行流程**：
批改作業 → 檢查獎勵 → 給予獎勵 `.then()` → 退學或懲罰 `.catch()`
```javascript
// 批改作業
function correctTest(name) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      const score = Math.round(Math.random()*100);
      if(score >= 20) {
        resolve({
          name,
          score
        })
      } else {
        reject("您已達退學門檻")
      }
    }, 2000)
  })
}
// 檢查獎勵
function checkReward(data) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      if(data.score >= 90) {
        resolve(`${data.name} 獲得電影票`);
      } else if (data.score >= 60 && data.score < 90) {
        resolve(`${data.name} 獲得嘉獎`);
      } else {
        reject(`您沒有獎品`)
      }
    }, 2000)
  })
}
// 執行函式
/* 在此填寫答案*/
```


回報流程
---
請同學依照下圖教學觀看解答、回報答案:

![](https://i.imgur.com/QtL8zEW.png)

回報格式如下圖，請在「回報區」使用註解回報答案 (為了統計人數，請同學依序加上「報數」)

![](https://i.imgur.com/L7kyew8.png)

<!-- 解答
correctTest("小明")
  .then(data => checkReward(data))
  .then(reward => console.log(reward))
  .catch(error => console.log(error))

-->


回報區
---


| 報數 | 組別 / 名字              | codepen / hackMD / 其他回饋 |
| ---- | ------------------------ | ------------------------------------------------------------------------ |
| 1    | 第 6 組 / Ruta           | https://codepen.io/rue503/pen/ZEvRVeN                                    |     |
| 2    | 第 6 組 / Wendy          | https://codepen.io/wendy03/pen/vYprvyx                                   |     |
| 3    | 第 9 組 / 黃士桓         | https://codepen.io/shr-huan-huang/pen/GRyGPjv                            |     |
| 4    | 第 2 組 / Vic            | https://codepen.io/hsuan333/pen/vYprvxm                                  |     |
| 5    | 第 5 組 / sihyun         | https://codepen.io/siyuch/pen/YzYvdrV?editors=0011                       |     |
| 6    | 第 3 組 / HedgehogKU     | https://codepen.io/hedgehogkucc/pen/wvpXRjE?editors=0112                 |     |
| 7    | 第 2 組 / Genos          | https://codepen.io/pb220416/pen/popKqyQ                                  |     |
| 8    | 第 2 組 / Jin            | https://codepen.io/Jin-L/pen/gOoKZJj                                     |     |
| 9    | 第 8 組 / Hank     | https://codepen.io/hank-hsiao/pen/zYpaeNZ                                |     |
| 10   | 第 3 組 / hiYifang       | https://codepen.io/hiYifang/pen/wvpXOGW                                  |     |
| 11   | 第 15 組 / Cadiis        | https://codepen.io/dronzefeng/pen/JjMZzqP                                |     |
| 12   | 第 8 組 / JackLee        | https://codepen.io/yxzzktmb/pen/OJzEGVx                                  |     |
| 13   | 第 2 組 / peter.chen1024 | https://codepen.io/JIAN-RONG/pen/ExoRJRP?editors=0012                    |     |
| 14   | 第 7 組 / 程翔           | https://codepen.io/xxxiang/pen/gOoKJRq?editors=1011                      |     |
| 15   | 0 / Aya                  | https://codepen.io/NoNameNote/pen/NWXzmbz                                |     |
| 16   | 第 14 組 / East          | [codepen](https://codepen.io/EastM/pen/VwydJvN?editors=0011)             |     |
| 17   | 第 10 組 / Butters       | [codepen](https://codepen.io/Butterscode/pen/oNpyRWq)                    |     |
| 18   | 第 4 組 / 苡安           | [codepen](https://codepen.io/yi-an-yang/pen/ExoRBwO)                     |     |
| 19   | 第 3 組 / Hobby          | [codepen](https://codepen.io/hobbyling/pen/WNdyqoR)                      |     |
| 20   | 第 11 組 / Han Lai       | [codepen](https://codepen.io/x94han/pen/wvpXLXJ)                         |     |
| 21   | 第 4 組 / Han Lai        | [codepen](https://codepen.io/bugbug777/pen/dyJKxpX)                      |     |
| 22   | 第 3 組 / Reynold        | [codepen](https://codepen.io/chasel1020/pen/xxpzvPZ)                     |     |
| 23   | 第 4 組 / 小宥           | [codepen](https://codepen.io/yosontw21/pen/ExoRqZx?editors=1111)         |     |
| 24   | 第 2 組 / joe            | [codepen](https://codepen.io/t7552175/pen/qBpKzvW?editors=1011)          |     |
| 25   | 第 8 組 / Jordan Tseng   | [codepen](https://codepen.io/jordan-ttc-design/pen/oNpMvEd?editors=1011) |     |
| 26   | 第 1 組 / Jerry Huang    | [codepen](https://codepen.io/sun31483/pen/qBpyBNL?editors=0010)          |     |
| 27   | 第 9 組 / konstante      | [codepen](https://codepen.io/konstantechang/pen/JjMBjoa?editors=0010)    |     |
| 28   | 第 3 組 / 小葉           | [codepen](https://codepen.io/Yu__hung/pen/XWVBJxb)                       |     |
| 29   | nick6303                 | [codepen](https://codepen.io/nick6303/pen/GRyBJVV?editors=1111)          |     |
| 30   | 第 1 組 / Snow           | [codepen](https://codepen.io/snowsuika/pen/rNprVRz)                      |     |
| 30   | 第 3 組 / charlie ku     | [codepen](https://codepen.io/CharlieKu50503/pen/XWVBXKw?editors=0112)    |     |
| 31   | 第 14 組 / ChloeLo       | [codepen](https://codepen.io/chloelo/pen/NWXBxZo)                        |     |
| 32   | 第 16 組 / 皓皓                     | [codepen](https://codepen.io/cutecat8110/pen/abEjZGP)                    | 
| 32   | Naiky                  | [CODEPEN @Naiky](https://codepen.io/naiky/pen/xxpyZav)                    | 
| 33   | 海底藍                   | [codepen](https://codepen.io/registermar3/pen/OJzwRbx?editors=0011)      |     |
| 34   | yolala                   | [codepen](https://codepen.io/chiakilalala/pen/jOYpMRR)                   |     |
| 35   | 第6組 / 馨云             | [codepen](https://codepen.io/bigheadyun/pen/mdpLMvz)                     |     |
| 36   | 第8組 / Albert           | [codepen](https://codepen.io/albert0810/pen/ExopXzM)                     |     |
| 37 | 第 15 組 / Tofu | [codepen](https://codepen.io/Tofutseng/pen/xxpJGYP)    |
| 38 | andyTsai | [codepen](https://codepen.io/AndyTsai/pen/QWaBxXy?editors=1011)    |
| 39 | 第 1 組 / Claire | [codepen](https://codepen.io/claire-chang-the-bashful/pen/XWVBxNK)    |
| 40 | 第 3 組 / Adam Hsu | [codepen](https://codepen.io/Adam-Hsu/pen/LYeBgam)    |
| 41 | 第 7 組 / jason06286 | [codepen](https://codepen.io/jasonuse/pen/qBpyQZM?editors=0011) |  
| 42 | 第 4 組 / Mischa | [codepen_mischa_day2](https://codepen.io/Dorothy_0528/pen/wvpxZMq?editors=0011)    |
| 43 | 第 8 組 / 陳暐中 | [codepen](https://codepen.io/wei-z/pen/dyJjLdX?editors=0011)    |
| 44 | 第 2 組 / wendy.li | [codepen](https://codepen.io/rockayumitw/pen/yLpEmow?editors=1111)    |
| 45 | Cloud Su | [codepen](https://codepen.io/Cloud0905/pen/abEjxBg?editors=0012)    |
| 46 | 第12組 Jimmy Chang | [codepen_Day2](https://codepen.io/JimmyChangWenChi/pen/MWrBRXx?editors=0012)    |
| 47 | 第14組 涼二 | [codepen](https://codepen.io/Araytsai/pen/xxpaxdJ)|
| 48 | 第14組 Uniza | [codepen](https://codepen.io/zhan-hong-lin/pen/JjMajNa)|
| 49 | 第 1 組 / Ed Huang | [codepen](https://codepen.io/yide1986/pen/OJzoVXo?editors=0011)|
| 50 | 第 3 組 / Larry    | [codepen](https://codepen.io/larrylinr5/pen/LYeJxNB?editors=1011) |
| 51 | 第 5 組 / Nap    | [codepen](https://codepen.io/o0o0o1o0/pen/WNdgpQZ) 
| 52 | 第 2 組 / Rikkubook    | [codepen](https://codepen.io/rikkubook/pen/JjMaJEZ?editors=1011) |
| 53 | 第 1 組 / Phoebe | [codepen](https://codepen.io/phoebe26/pen/GRyXmvG) |
| 54 | 第 3 組 / Justin | [codepen](https://codepen.io/justin3737/pen/mdpGBZQ) |
|55|第13組/KFC|[codepen](https://codepen.io/kuan-fu-chen/pen/qBpMMdw?editors=1012)|
|56|第15組 / Chiu|[codepen](https://codepen.io/awdx8326/pen/JjMammJ?editors=0011)|
|57|第6組 / 謦麟|[codepen](https://codepen.io/pvzfeusk/pen/ZEvRVLN?editors=0011)|
|58|第5組 / 灰塵貓|[codepen](https://codepen.io/oqioqi/pen/ExodgbM?editors=1112)|
|59|第1組 / kimn|[codepen](https://codepen.io/kimn/pen/KKZBNaK)|
|60|第11組 /mandy|[codepen](https://codepen.io/manyu1225/pen/XWeNQbz?editors=1011)|
|61|第10組 /Otis|[codepen](https://codepen.io/humming74/pen/WNdYjmL?editors=0011)|
|62|第10組 / 橘子|[codepen](https://codepen.io/joanne-wei/pen/xxpmxKO)|
|63|第5組 / Hazel|[HackMD@Hazel](https://hackmd.io/@hazelwu/day2)|
| 64 | 第 1 組 / Emily Hsi | [codepen](https://codepen.io/EmilyHsi/pen/RwxEKax) |
|  65  |    第 12 組 / 傷腦經   |  [codepen](https://codepen.io/souljazz/pen/zYpbEYp) |
|  66  |    第 8 組 / sam   |  [codepen](https://codepen.io/lee-wei-hong/pen/PoELyyz) |
|  67  |    第 5 組 / AmberCYT   |  [codepen](https://codepen.io/amberTing/pen/zYpQqrw?editors=1011) |
|  68  |    第 7 組 / TracyChien   |  [codepen](https://codepen.io/tracychien-the-encoder/pen/WNMeEYM?editors=0011) |
|  69  |    第 12 組 / Sylvia-H   |  [codepen](https://codepen.io/Cosmosheart/pen/rNJOpmM?editors=0011) 
|  70  |    第 14 組 / 皮皮   |  [codepen](https://codepen.io/super-shrimp/pen/MWQZQRe?editors=0012) |