JavaScript - 自定義錯誤

自定義錯誤是建立JavaScript中使用者定義錯誤型別的一種方法。這對於處理特定型別的錯誤（例如資料庫錯誤或HTTP錯誤）非常有用。

JavaScript包含多個內建的錯誤物件。每當JavaScript程式碼中發生任何錯誤時，它都會丟擲一個Error類的例項。但是，您也可以使用'throw'語句丟擲帶有自定義訊息的Error類例項。

在某些情況下，開發人員需要建立自定義錯誤。例如，您正在獲取使用者在輸入中輸入的年齡。如果使用者的年齡未滿18歲，您可以丟擲一個自定義錯誤，例如'ageNotValid'，以便更清晰地說明。

讓我們先了解Error類的語法，然後您將學習如何建立自定義錯誤。

Error 類

在JavaScript中，Error是一個通用的錯誤類。您可以建立一個Error類的例項，並將自定義訊息作為引數傳遞。

Error類包含三個屬性：name、message和stack。

因此，您可以假設Error類的語法如下所示。

class Error {
   constructor(message) {
      this.message = message;
      this.name = "Error"; 
      this.stack = <call stack>;
   }
}

在上述語法中，'stack'屬性是非標準屬性。僅Firefox瀏覽器支援它。

使用Error類的例項建立自定義錯誤

建立自定義錯誤最簡單的方法是建立Error類的例項並更改其屬性。

語法

您可以按照以下語法透過更改Error類例項的屬性來建立自定義錯誤。

const customError = new Error(message);
customError.name = "CustomError";

在這裡，我們建立了'Error'類的例項，並將'message'作為引數傳遞。此外，我們還更改了'name'屬性的值。同樣，如果您不想將其作為Error()建構函式引數傳遞，則可以更改'message'屬性的值。

引數

message − 這是一個表示錯誤的文字訊息。

示例

在下面的程式碼中，我們建立了Error類的例項，並將其儲存在'customError'變數中。之後，我們將'name'屬性的值更改為'CustomError'。

在try{}塊中，我們使用了'throw'語句來丟擲自定義錯誤，在catch{}塊中，我們列印錯誤名稱和訊息。

<html>
<body>
   <div id = "output"> </div>
   <script>
      const customError = new Error("This is a custom error");
      customError.name = "CustomError";
      try {
         throw customError;
      } catch (err) {
         document.getElementById("output").innerHTML = err;
      }
   </script>
</body>
</html>

輸出

CustomError: This is a custom error

使用函式建構函式建立自定義錯誤

您可以使用函式建構函式來建立物件的模板。函式建構函式應包含'name'和'message'屬性。

接下來，您可以使用Error類的原型更改函式建構函式的原型。

語法

您可以按照以下語法使用函式類的建構函式建立自定義錯誤。

function validationError(messag, name) {
   this.message = messag;
   this.name = name;
}
validationError.prototype = Error.prototype;

在上述語法中，我們定義了validationError()函式，它接受message和name作為引數。之後，我們用引數值初始化函式的message和name屬性。

接下來，我們使用Error類的原型更改函式的原型。

示例

在下面的程式碼中，我們定義了validationError()函式建構函式，並使用Error類的原型繼承它。

在try{}塊中，我們定義了'str'變數並用數值初始化它。之後，我們使用typeof運算子驗證'str'變數的型別。如果不是字串，則透過傳遞message和name作為引數來丟擲'validationError'。

在catch{}塊中，我們在網頁上列印訊息。您可以執行程式碼，並在輸出中觀察錯誤。

<html>
<body>
   <div id = "demo"> </div>
   <script>
      const output = document.getElementById("demo");
      function validationError(message = "", name = "validationError") {
         this.message = message;
         this.name = name;
      }
      validationError.prototype = Error.prototype;

      try {
         let str = 10;
         if (typeof str != "string") {
            throw new validationError("Not a string", "NotStringError");
         } else {
            output.innerHTML = "String is valid";
         }
      } catch (e) {
         output.innerHTML = e.name + ": " + e.message;
      }
   </script>
</body>
</html>

輸出

NotStringError: Not a string

透過擴充套件Error類建立自定義錯誤

建立自定義錯誤的最佳方法是建立一個新類，並使用'extends'關鍵字擴充套件它。它使用了繼承的概念，自定義錯誤類繼承了Error類的屬性。

在constructor()函式中，您可以初始化自定義錯誤類的屬性。

語法

您可以按照以下語法透過擴充套件Error類來建立自定義錯誤。

class CustomError extends Error {
   constructor(message) {
      super(message)
      // Initialize properties
   }
}

在上面的程式碼中，我們使用super()方法呼叫父類建構函式。

您也可以在建構函式中初始化CustomError類的屬性。

您可以根據需要使用以上任何方法建立自定義錯誤。

列印頁面