今日的目標：

• new Promise
• then / catch / finally
• 鏈式操作 + 錯誤傳遞

1. Promise 是什麼？

Promise就像一張會在未來回來的收據，
當我們發出一個非同步請求（例如抓 API），
JavaScript 當下不會給資料，而是給一張 Promise 收據。

收據之後會變成：

• fulfilled（成功）：有結果 value
• rejected（失敗）：有原因 reason

接著用 then / catch / finally 在結果回來時「補上後續動作」。

2. new Promise：自己包一個非同步動作

語法：

const p = new Promise((resolve, reject) => {
  // 這裡放非同步程式碼
});

new Promise(...) 會立刻執行裡面的函式
裡面 (resolve, reject) => { ... }
想表示「成功」就呼叫 resolve(值)
想表示「失敗」就呼叫 reject(錯誤)

const p = new Promise((resolve, reject) => {
  console.log("Promise 開始執行");

  // 模擬一個要 1 秒才完成的工作
  setTimeout(() => {
    const ok = Math.random() > 0.3; // 70% 機率成功

    if (ok) {
      resolve("這是成功時要給你的資料");
    } else {
      reject(new Error("事情失敗了 QQ"));
    }
  }, 1000);
});

resolve(...)：把 Promise 狀態從 pending → fulfilled，並帶一個 value
reject(...)：把 Promise 狀態從 pending → rejected，並帶一個 reason（通常是 Error 物件）
只能成功一次或失敗一次，之後再呼叫 resolve/reject 都會被無視

平常比較少會自己寫 new Promise，
因為很多函式（像 fetch）已經幫你包好 Promise 了，
但了解 new Promise 會比較好理解 Promise 的運作方式。

3. then()：成功時要做什麼

p.then((data) => {
  console.log("成功：", data);
});

then()裡面放的是成功之後要執行的動作
只要 Promise 最後是 fulfilled，就會跑這裡

4. catch()：失敗時要做什麼

p.catch((err) => {
  console.log("失敗：", err);
});

只要 Promise 是 rejected 就會跑這裡
放在最下面就能一次接住整條鏈裡的所有錯誤

5. finally()：不管成功失敗，都會做一次

p.finally(() => {
  console.log("不管結果，都會執行");
});

常見用法：關掉 loading、恢復按鈕等「收尾動作」

6. 基本鏈式操作

p.then((data) => {
  console.log("第一個 then：", data);
  return data + " 123"; // 回傳給下一個 then
})
.then((newData) => {
  console.log("第二個 then：", newData);
});

在 then 裡 return 的東西，會變成下一個 then 的參數。
如果沒 return → 下一個 then 會拿到 undefined

7. 錯誤傳遞

如果你在 then 裡丟出錯誤：

p.then((data) => {
  throw new Error("我故意丟錯");
})
.catch((err) => {
  console.log("錯誤被 catch 接住：", err.message);
});

Promise 只要一個地方出錯
就會直接跳到最近的 catch