04-2 優雅的崩潰：Error Handling 與 Try/Catch

1. 基礎防護：Try…Catch

當你執行一段可能會「爆炸」的程式碼時（例如讀取一個不存在的變數屬性，或是發送網路請求），請把他包在 try 塊中。

try {
  // 這裡放可能會有危險的程式碼
  const data = JSON.parse("{ invalid json }");
} catch (error) {
  // 當 error 發生時，執行這裡
  console.warn("唉呀，JSON 資料格式不對喔！", error.message);
} finally {
  // 不論成敗，最後都會執行（常用於關閉讀取動畫）
  console.log("處理完畢。");
}

2. 自行拋出錯誤：Throw

有時候，語法沒錯，但「內容」錯了。例如：用戶沒填寫 Email。

function checkAge(age) {
  if (age < 18) {
    throw new Error("你還太年輕，不能看這部分內容！");
  }
  return "歡迎光臨！";
}

try {
  checkAge(10);
} catch (e) {
  alert(e.message); 
}

3. 2026 實務建議：別過度 Catch

在現代開發（如 React 或 Astro）中，我們傾向於在最外層處理 UI 錯誤。

• 不要語法過敏：如果你不知道抓到錯誤後要做什麼，就別抓它。
• 給出具體的訊息：throw new Error("系統壞了") 是最爛的做法。請告訴用戶「資料庫暫時連不上」。