JavaScript - 仲展錯誤

你好，未來的JavaScript大師們！今天，我們將要進入JavaScript中令人興奮的仲展錯誤的世界。如果你是編程新手，別擔心——我將成為你這次冒險中的友好導遊。在本課結束時，你將能夠像專家一樣創建有自己特色的錯誤！

JavaScript - Extending Errors

仲展錯誤類：創建自定義錯誤

我們從基礎開始。在JavaScript中，我們有一個內置的Error類，我們可以使用它來創建錯誤對象。但有時候，我們的應用程序需要更特定的錯誤。這就是仲展Error類派上用場的地方！

為什麼要仲展錯誤？

想像一下，你正在開發一個烹飪應用程序，並且你想為廚房意外創建特定的錯誤。你可以使用通用的Error，但有BurnedFoodError或OverseasonedError不是更好嗎？這正是我們將學習的！

仲展錯誤的基本語法

我們從一個簡單的例子開始：

class KitchenError extends Error {
constructor(message) {
super(message);
this.name = 'KitchenError';
}
}

讓我們分解一下：

我們使用class關鍵字定義我們新的錯誤類。
extends Error告訴JavaScript，我們的新類應該從內置的Error類繼承。
在constructor中，我們調用super(message)來確保父Error類被正確初始化。
我們設定this.name來給我們的錯誤一個特定的名字。

現在，讓我們看看我們如何使用它：

try {
throw new KitchenError("義大利麵粘在天花板上！");
} catch (error) {
console.log(error.name); // 輸出：KitchenError
console.log(error.message); // 輸出：義大利麵粘在天花板上！
}

添加自定義屬性

仲展錯誤最酷的事情之一就是我們可以添加自己的自定義屬性。讓我們增強我們的KitchenError：

class KitchenError extends Error {
constructor(message, dish) {
super(message);
this.name = 'KitchenError';
this.dish = dish;
}
}

try {
throw new KitchenError("它在燃燒！", "烤肉");
} catch (error) {
console.log(`哦不！${error.dish}有麻煩：${error.message}`);
// 輸出：哦不！烤肉有麻煩：它在燃燒！
}

在這個例子中，我們為我們的錯誤添加了一個dish屬性。這讓我們能夠提供更多關於我們廚房災難中到底發生了什麼的上下文！

創建特定的錯誤類型

既然我們知道了如何仲展Error類，讓我們為我們的廚房應用程序創建一些特定的錯誤類型：

class BurnedFoodError extends KitchenError {
constructor(dish) {
super(`The ${dish} is burned to a crisp!`, dish);
this.name = 'BurnedFoodError';
}
}

class OverseasonedError extends KitchenError {
constructor(dish, seasoning) {
super(`The ${dish} is over-seasoned with ${seasoning}!`, dish);
this.name = 'OverseasonedError';
this.seasoning = seasoning;
}
}

現在我們可以在我們的代碼中使用這些特定的錯誤類型：

function cookDinner(dish, seasoning) {
if (Math.random() < 0.5) {
throw new BurnedFoodError(dish);
} else if (Math.random() < 0.5) {
throw new OverseasonedError(dish, seasoning);
}
console.log(`Your ${dish} is perfectly cooked!`);
}

try {
cookDinner("牛排", "鹽");
} catch (error) {
if (error instanceof BurnedFoodError) {
console.log(`Oops! ${error.message} 時間叫外賣。`);
} else if (error instanceof OverseasonedError) {
console.log(`Yikes! ${error.message} 下次也許少用點${error.seasoning}。`);
} else {
console.log("廚房裡出了一些問題！");
}
}

這段代碼模擬了烹飪的不確定性（至少對我們中的一些人來說！）並展示了我們如何以不同的方式處理不同類型的錯誤。

多級繼承

現在，讓我們把錯誤層次結構提升到下一個水平——字面上！我們可以創建一個錯誤類型的鏈，每個類型都從前一個類型繼承。這被稱為多級繼承。

讓我們擴展我們的廚房錯誤系統：

class KitchenApplianceError extends KitchenError {
constructor(message, appliance) {
super(message);
this.name = 'KitchenApplianceError';
this.appliance = appliance;
}
}

class OvenError extends KitchenApplianceError {
constructor(message) {
super(message, 'oven');
this.name = 'OvenError';
}
}

class MicrowaveError extends KitchenApplianceError {
constructor(message) {
super(message, 'microwave');
this.name = 'MicrowaveError';
}
}

在這個例子中：

KitchenApplianceError 仲展 KitchenError
OvenError 和 MicrowaveError 都仲展 KitchenApplianceError

讓我們看看我們如何使用這個層次結構：

function useAppliance(appliance) {
if (appliance === 'oven') {
throw new OvenError("烤箱不會加熱！");
} else if (appliance === 'microwave') {
throw new MicrowaveError("微波爐發出奇怪的聲音！");
}
}

try {
useAppliance('oven');
} catch (error) {
if (error instanceof OvenError) {
console.log(`烤箱問題：${error.message}`);
} else if (error instanceof MicrowaveError) {
console.log(`微波爐問題：${error.message}`);
} else if (error instanceof KitchenApplianceError) {
console.log(`一般家電錯誤，發生在${error.appliance}上：${error.message}`);
} else if (error instanceof KitchenError) {
console.log(`廚房錯誤：${error.message}`);
} else {
console.log(`意外錯誤：${error.message}`);
}
}

這種多級繼承讓我們能夠創造非常特定的錯誤類型，同時還能保持一個合理的層次結構。我們可以在不同的專業程度捕獲錯誤，從最特定的（OvenError）到最一般的（Error）。

方法表

這裡是一個我們在自定義錯誤中使用過的关键方法和屬性的總結：

方法/屬性	描述	示例
`constructor()`	初始化錯誤對象	`constructor(message, dish)`
`super()`	調用父類構造函數	`super(message)`
`this.name`	設定錯誤名稱	`this.name = 'KitchenError'`
`this.[custom]`	添加自定義屬性	`this.dish = dish`
`instanceof`	檢查對象是否為類的實例	`if (error instanceof OvenError)`

記住，仲展錯誤不僅僅是為你的錯誤創造花哨的名稱——它是關於在代碼中以結構化的方式處理不同類型的錯誤。這可以使調試更容易，並使你的錯誤信息更為詳細和特定。

所以，下次你編程時出現問題，不要只是抛出一个通用错误——創造一个自定义的错误！谁知道，也许你的CodeSpaghettiError会成为你开发团队的热门话题。快乐编码，愿你的所有错误都得到完美的扩展！

Credits: Image by storyset

上一教程:

JavaScript - 自定義錯誤

下一教程:

JavaScript - this 關鍵字