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

# 🏅 Day 5 - 非同步概念、async await

async 及 await 是執行非同步函式的一種寫法，此寫法可以讓非同步函式在閱讀上更接近同步函式

在非同步函式前加上 `async` 關鍵字，執行此函式時回傳值就會被轉為一個 Promise
在 `async` 非同步函式中，使用 `await` 接收回傳的結果，它會暫停此 async 函式的執行，並且等待 Promise 的解析，解析完之後會回傳解析值，並繼續此 async 函式的執行
也就是說在未等待到結果回傳前，不會執行到 `await` 之後的程式

範例：

function resolveAfter2Seconds(x) {
  return new Promise(resolve => {
    setTimeout(() => {
      resolve(x);
    }, 2000);
  });
}

async function add1(x) {
  const a = await resolveAfter2Seconds(20);
  const b = await resolveAfter2Seconds(30);
  return x + a + b;
}

### 參考資源
- [Async function / Await 深度介紹 | 卡斯伯 Blog - 前端，沒有極限](https://www.casper.tw/development/2020/10/16/async-await/)
- [利用 async 及 await 讓非同步程式設計變得更容易 | MDN](https://developer.mozilla.org/zh-TW/docs/conflicting/Learn/JavaScript/Asynchronous/Promises)
- 課程影音「async、await 再升級」

## 題目
流程：
批改作業 → 檢查獎勵 → 給予獎勵 → 退學或懲罰

// 批改作業
function correctTest(name) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      const score = Math.round(Math.random()*100);
      if(score >= 60) {
        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)
  })
}

將以下這段程式碼改寫為 async await 的寫法

 correctTest("小明")
  .then(data => checkReward(data))
  .then(reward => console.log(reward))
  .catch(error => console.log(error))

回覆範例：

const init = async function() {
 /* 在此填寫答案 */
}
init();

## 回報流程

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


<!-- 解答：

const init = async function() {
try {
const studentData = await correctTest("小明");
const reward = await checkReward(studentData);
} catch (error) {
console.log(error);
}
}
init();
-->

回報區
---

| 報數 | 組別／Discord 名字 | Codepen／其他回饋 |
|:----:|:-------------------:|:---------------------------------------------------------------------------------------------------------------------------------:|
| 1 | 北 10 組 / Benson | [Github Benson - Day 5](https://github.com/ioveasdkre/HexschoolOperation/tree/main/NodejsEnterpriseClass/day40-tasks/day5/app.ts) |
| 2 | 北 1 組 / PittWu | [Blog Post - Day 5](https://pitt-wu-blog.vercel.app/docs/day5-async-await) |
| 3 | 北 5 組 / 圈圈 | [Codepeb - Day 5](https://codepen.io/wjejfczn-the-bold/pen/PodRBay?editors=0011) |
| 4 | 北 8 組 / Zhao Chen | [GitHub - Day 5](https://github.com/zhao1995chen/NodejsEnterpriseClass/blob/master/daily-task/day5/index.ts) |
| 5 | 北 1 組 / MayYi | [Codepen - Day 5](https://codepen.io/mayyang/pen/qBMyvVW?editors=0011) |
| 6 | 南 2 組 / fengyao | [GitHub - Day 5](https://github.com/fengyao33/sixfeet/commit/fd6b3f93f49da18f53ce6747248281fb6ec1c9e5) |
| 7 | 北 11 組 / Eddie | [codepen - Day 5](https://codepen.io/eddie605134/pen/QWVJwpm?editors=1111) |
| 8 | 中 3 組 / Wendy | [codepen - Day 5](https://codepen.io/wendy03/pen/QWVJMwq) |
| 9 | 中 4 組 / jimkk159 | [codepen - Day 5](https://codepen.io/jimkk159/pen/RwYqpYp) |
| 10 | 北 12 組 / Sam Lin | [GitHub - Day 5](https://github.com/samlin1122/hex-school/blob/main/daily-challenges/day5.js) |
| 11 | 北 8 組 / Ryder | [Codepen - Day 5](https://codepen.io/rider159159/pen/jOvdGEz?editors=1010) |
| 12 | 北 8 組 / Ryan | [Codepen - Day 5]( https://codepen.io/chingyuan/pen/dyqLepe) |
| 13 | 南 1 組 / hiYifang | [Codepen - Day 5]( https://codepen.io/hiYifang/pen/dyJgoBd) |
| 14 | 北 13 組 / Louisa | [GitHub - Day 5](https://github.com/louisa0416/NodejsEnterpriseClass/tree/master/daily-task/day05) |
| 13 | 北 13 組 / sasha | [Codepen - Day 5]( https://codepen.io/sasay/pen/ExeBJYa) |
| 16 | 北 16 組 / Zoe Wu | [ GitHub - Day 5](https://github.com/Zoe561/hexschool/blob/master/nodejs-enterprise-class/daily-task/day5/app.js) |
| 17 | 北5組 / Albee | [GitHub-Day 5](https://github.com/albee-chang/hexschool-node-dailytask/blob/main/day5/app.js)|
| 18 | 北 1 組 / Asher | [ Notion - Day 5](https://wh-lin.notion.site/Day5-async-await-Asher-9d05d42b82e244d1bd090367ce6b4dec)
| 19 | 中 4 組 / Zoey | [ codepen - Day 5](https://codepen.io/jsbo12551a/pen/YzJqJOz?editors=0012) |
| 29 | 北 16 組 / 啊培培 | [ GitHub - Day 5](https://github.com/LABIBI-LG/Courses/blob/main/hexschool/nodeJS/Live_Course/Daily_Tasks/day5/main.js) |