---
# System prepended metadata

title: "\U0001F3C5 Day 1 - 非同步概念、建立 Promise"
tags: [Node.js 直播班 - 2023 春季班]

---

---
tags: Node.js 直播班 - 2023 春季班
---

# 🏅 Day 1 - 非同步概念、建立 Promise

### 前言
因接下來在實作後端處理請求、存取資料庫並回傳資料、回應，需要等待結果，就會需要使用到非同步作法，而以往的非同步做法是使用 callback function 的寫法，這個寫法的問題是若是一層接著一層接連使用 callback 會造成難以閱讀、追蹤程式碼，Promise 語法是較新的非同步作法，會更容易閱讀一些

### 建立 Promise 簡介
Promise 是一個物件，代表一個即將完成或失敗的非同步操作，以及回傳的值
語法為：
```javascript=
new Promise((resolve, reject) => {
  // 執行一些非同步作業，最終呼叫:
  //
  // resolve(someValue); // 實現
  // 或
  // reject("failure reason"); // 拒絕
} );
```
其中兩個參數 resolve 及 reject 都是函式，分別代表實現（完成）及拒絕的函式，當非同步操作成功完成時就會執行 resolve 函式完成 promise，錯誤、失敗則執行 reject 函式，若是`(resolve, reject) => { ... }` 函式執行時出錯，promise 會被拒絕，執行 reject 函式時會回傳 error 物件或失敗訊息

### 參考資源
- [非同步的 JavaScript 介紹 - 學習該如何開發 Web | MDN](https://developer.mozilla.org/zh-TW/docs/Learn/JavaScript/Asynchronous/Introducing)
- [JavaScript Promise 全介紹 | 卡斯伯 Blog - 前端，沒有極限](https://www.casper.tw/development/2020/02/16/all-new-promise/)
- 課程影音「Node.js 非同步技巧 - Promise、Async、Await」

## 題目

以下為一段判斷分數是否及格的函式，請嘗試將此函式使用 Promise 語法改寫
```JavaScript=
const checkScore = (score) => {
  /* 回傳一個 Promise，並執行以下非同步操作*/
  const score = Math.round(Math.random() * 100);
  /* 判斷流程請嘗試使用 setTimeout() 執行 */
  if(score >= 60) {
    console.log(score); // 執行實現方法
  } else {
    console.log("不及格"); // 執行拒絕方法
  }
}
```

## 回報流程

將答案寫在 CodePen 並複製 CodePen 連結貼至底下回報就算完成了喔! 
解答位置請參考下圖（需打開程式碼的部分觀看）

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

<!-- 解答：  
const checkScore = (score) => {
  return new Promise((resolve, reject) => {
   const score = Math.round(Math.random() * 100);
   setTimeout(() => {
    if (score >= 60) {
      resolve(score); // 執行實現方法
    } else {
      reject("不及格"); // 執行拒絕方法
    }
  } )
};
-->




回報區
---

| 報數 | 組別／Discord 名字  | Codepen／其他回饋                                                                                                                 |
|:----:|:-------------------:|:--------------------------------------------------------------------------------------------------------------------------------- |
|  1   |  北 1 組 / PittWu   | [Blog Post - Day 1](https://pitt-wu-blog.vercel.app/docs/day1-promise-async-await)                                                |
|  2   |  北 10 組 / Benson  | [Github Benson - Day 1](https://github.com/ioveasdkre/HexschoolOperation/tree/main/NodejsEnterpriseClass/day40-tasks/day1/app.ts) |
|  3   |  北 6 組 / pamiya   | [codepen - Day 1](https://codepen.io/chiakilalala/pen/jOvwjVa?editors=1111)                                                       |
|  4   |   北 5 組 / 圈圈    | [Codepen - Day 1](https://codepen.io/wjejfczn-the-bold/pen/abaqJgx?editors=0010)                                                  |
|  5   |   南 2 組 / Duke    | [Codepen - Day 1](https://codepen.io/DukeTian/pen/BaOYYGx?editors=0011)                                                           |
|  6   |   北 1 組 / MayYi   | [Codepen - Day 1](https://codepen.io/mayyang/pen/MWqGozW?editors=0011)                                                            |
|  7   | 北 8 組 / Zhao Chen | [GitHub - Day 1](https://github.com/zhao1995chen/NodejsEnterpriseClass/blob/master/daily-task/day1/index.js)                      |
|  8   |   北5組 / Tuhacrt   | [Codepen](https://codepen.io/Tuhacrt/pen/dyqqNgY)                                                                                 |
|  9   |  南 2 組 / LEONARD  | [Codepen - Day 1](https://codepen.io/clps935419/pen/xxaaNJY?editors=0010)                                                         |
|  10   |   北5組 / Tuhacrt   | [Codepen](https://codepen.io/Tuhacrt/pen/dyqqNgY)                                                                                 |
|  11  | 北 3 組 / erik1110  | [GitHub - Day 1](https://github.com/erik1110/NodejsEnterpriseClass/blob/main/daily-task/day1/index.ts)                            |
|  12  |  南 2 組 / fengyao  | [GitHub - Day 1](https://github.com/ioveasdkre/HexschoolOperation/blob/main/NodejsEnterpriseClass/day40-tasks/day1/app.ts)        |
|  13  |  北 11 組 / eddie   | [Codepen - Day1](https://codepen.io/eddie605134/pen/GRXwKqd?editors=1111)                                                         |
|  14  |   北 8 組 / Ryder   | [Codepen - Day1](https://codepen.io/rider159159/pen/ExeOYLW?editors=1010)                                                         |
|  15  |   中 3 組 / Wendy   | [Codepen - Day1](https://codepen.io/wendy03/pen/XWPygPq)                                                                          |
|  16  | 中 5 組 / jimkk159  | [Codepen - Day1](https://codepen.io/jimkk159/pen/BaOGpqK)                                                                         |
|  17  |  北 16 組 / 啊培培  | [GitHub - Day1](https://github.com/LABIBI-LG/Courses/blob/main/hexschool/nodeJS/Live_Course/Daily_Tasks/day1/main.js)             |
|  18  | 北 12 組 / Sam Lin  | [GitHub - Day 1](https://github.com/samlin1122/hex-school/blob/main/daily-challenges/day1.js)                                     |
|  19  |   北16組 / Zoe Wu   | [GitHub - Day 1](https://github.com/Zoe561/hexschool/blob/master/nodejs-enterprise-class/daily-task/day1/app.js)                  |
|  20  |    北8組 / Ryan     | [codepen - Day 1](https://codepen.io/chingyuan/pen/gOdqRoq?editors=0011)                                                          |
|  21  |    北 17組 / Chian     | [codepen - Day 1](https://codepen.io/chian-yang/pen/LYJqMrv)                                                          |
|  22  |    南 2組 / Kai     | [codepen - Day 1](https://codepen.io/Shung-Kai/pen/xxaBeNQ?editors=1012)                                                          |
|  23  |    北 16 組 / 文文     | [codepen - Day 1](https://codepen.io/chiawen81/pen/wvEbNrG?editors=0011)                                                          |
|  24  |    南 1 組 / hiYifang     | [codepen - Day 1](https://codepen.io/hiYifang/pen/GRydjJQ)   |
|  25  | 北 13 組 / Louisa  | [GitHub - Day 1](https://github.com/louisa0416/NodejsEnterpriseClass/tree/master/daily-task/day01) |
|  26  |    北 13 組 / sasha     | [codepen - Day 1](https://codepen.io/sasay/pen/dyqBraX)   |
|27 | 南 1 組 / Christina  | [Codepen - Day 1](https://codepen.io/chrisc0210/pen/ZEMgpLg)|
|28|中 3 組 / Jill|[codepen - Day 1](https://codepen.io/chi-ling-lee/pen/xxyxexm?editors=0011)|
|29|北5組/albee|[GitHub-Day 1](https://github.com/albee-chang/hexschool-node-dailytask/tree/main/day1)|
|30|北 1 組 / Asher |[Notion - Day 1](https://wh-lin.notion.site/Day1-Promise-47a11c8925854b21ac763bf794881e57)|
|  31  |    中 4 組 / Zoey     | [codepen - Day 1](https://codepen.io/jsbo12551a/pen/abRNRwa?editors=0011)   |

