### Promise
Promise 是一個函式建構子，可以透過 new Promise() 的方式建立，建立出的 Promise 物件代表一個非同步操作，這個操作會包含以下的狀態
- 執行中（pending）
- 執行完成、成功（fulfilled）
- 執行完成、失敗（rejected）

如：

const myPromise = new Promise((resolve, reject) => {
  // 執行一些非同步作業
  setTimeout(function () {
    resolve("Success!"); // 操作成功，回傳值為 "Success!"
  }, 0);
    
  if(false) {
    reject("failure reason"); // 拒絕，回傳錯誤提示
  }
  
});

### async/await 與 Promise

async function 代表非同步的 function，會回傳一個 Promise，當 Promise 狀態為操作成功，async function 會回傳 resolve() 的值，若 Promise 狀態為操作失敗，async function 則會拋出錯誤，並出現 reject() 的錯誤訊息。

await 是一個運算子，可用於等待 Promise 結果，且只能在 async function 內使用。
當 async function 內使用 await，會等待 Promise 非同步操作結束，才會接續執行 await 以後的程式。
例如：

function promiseFn() {
  return new Promise((resolve, reject) => {
  // 執行一些非同步作業
  setTimeout(function () {
    resolve("Success!"); // 操作成功，回傳值為 "Success!"
  }, 0);

  if(false) {
    reject("failure reason"); // 拒絕，回傳錯誤提示
  }
  });
}
async function getResult() {
 const result = await promiseFn();
 // 接收到 promiseFn() 結果後才會接續後面的程式
 ...
}
getResult();

async/await 的寫法可以讓非同步的執行過程，在瀏覽程式碼時像是同步的流程（實際上仍是非同步操作）。
## 題目
請複製 （右下角 fork）這個[範例](https://codepen.io/yen-kg/pen/XWvOaav?editors=1010)，使用 async/await 寫法取得呼叫 API 的結果 https://dog.ceo/api/breeds/image/random ，並在 console 印出 圖片 URL。

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

<!-- 解答：

async function fetchAPI() {
  const response = await fetch('https://dog.ceo/api/breeds/image/random');
  const responseJson = await response.json();
  console.log(responseJson.message);
}
fetchAPI()

-->

回報區
---
| # | Discord | CodePen / 答案 |
|:---:|:-------------- |:----------------------------------------------------------------------------- |
| 1 | MY | [Codepen](https://codepen.io/ahmomoz/pen/OPLQZBe?editors=1011) |
| 2 | Sonia | [Codepen](https://codepen.io/YUJOU/pen/ogvPedg?editors=1011) |
| 3 | Noy(Toad) | [Codepen](https://codepen.io/MochiCodingPen/pen/RNbYJQx?editors=1010) |
| 4 | LinaChen | [Codepen](https://codepen.io/LinaChen/pen/qEWQBOr) |
|5|Hailey|[CodePen](https://codepen.io/sxbokfja-the-flexboxer/pen/emOQYaW?editors=1011)|
| 6 | tim | [Codepen](https://codepen.io/jskrtivy-the-animator/pen/pvzQoYb?editors=1011) |
| 7 | 毛巾 | [Codepen](https://codepen.io/bqdcjboa-the-solid/pen/zxOMYXd) |
| 8 | 4chan | [Codepen](https://codepen.io/ijuolaqc-the-looper/pen/JoPejVp) |
| 9 | Nocab | [Codepen](https://codepen.io/PeihanWang/pen/pvzQoPo?editors=1012) |
| 10 | mercury2508. | [Codepen](https://codepen.io/Mercury2508/pen/EaYOxGv) |
| 11 | Aaron 謝宗佑 | [Codepen](https://codepen.io/aaron-hsieh/pen/qEWQEdy) |
| 12 | Kaya | [Codepen](https://codepen.io/kayaribi/pen/OPLaPvN) |
| 13 | ya_meow | [Codepen](https://codepen.io/gkfxzvcb-the-bashful/pen/EaYOagE?editors=0011)|
| 14 | 嚼勁先生 | [Codepen](https://codepen.io/James520284/pen/wBwQKWR)|
| 15 | Jasmine | [Codepen](https://codepen.io/Jasmine-Lin-the-vuer/pen/gbYQPgY) |
| 16 | 泊岸 | [Codepen](https://codepen.io/qoq77416416/pen/EaYOyJw?editors=1010) |
| 17 | Clove | [Codepen](https://codesandbox.io/p/sandbox/gdhp6j) |
| 18 | Toung | [Codepen](https://codepen.io/Toung/pen/yyBQpvo) |
| 19 |邵|[Codepen](https://codepen.io/ukscrlno-the-typescripter/pen/jENQvwM?editors=1012)|
| 20 |Johnson|[Codepen](https://codepen.io/crpbugqy-the-typescripter/pen/YPKdWYE)|
| 21 | Amanda | [Codepen](https://codepen.io/cym199922/pen/KwPbmXo) |
| 22 | Satar | [Codepen](https://codepen.io/SatarKuo/pen/jENRejB?editors=0011) |
| 23 | Rogan | [Codepen](https://codepen.io/RoganHsu/pen/JoPqjQj?editors=1011) |
| 24 | 蘑菇星星 | [Codepen](https://codepen.io/brrrieon-the-vuer/pen/JoPQjRa?editors=1012) |
| 25 | yaoling.liang | [Codepen](https://codepen.io/Yao-Ling-L-/pen/xbxVopQ?editors=1012) |
| 26 | KOMATSU PEI | [Codepen](https://codepen.io/Komatsu2021/pen/JojONNN?editors=1012) |
| 27 | 姜承 | [Codepen](https://codepen.io/Troy0718/pen/zxYJREP?editors=1012) |
| 28 | shin_kai | [Codepen](https://codepen.io/KAI-SHIN-the-animator/pen/zxrKJpN) |

---

- 快速複製格式：

| 0 | user | [Codepen]() |