如何在 TypeScript 中解決過多的 try catch?


我們可以使用 try-catch 語句來解決 TypeScript 中的錯誤。有時,我們需要在程式碼中新增多個 try-catch 塊來處理多個錯誤。

當我們在程式碼中新增多個 try-catch 語句時,程式碼變得難以閱讀,並且開發人員重構起來很頭疼。在本教程中,我們將學習如何將過多的 try-catch 塊轉換為單個 try-catch 塊,該塊可以管理多個錯誤。

語法

使用者可以按照以下語法在 TypeScript 中使用單個 try-catch 塊。

try {
   throw new Error("error_message");
   // this code will not be executed
}
catch (error) {
   // manage the error
}

在以上語法中,我們在 try 塊內丟擲錯誤,並在 catch 塊中捕獲錯誤。

每當我們在 try 塊中遇到任何錯誤時,執行控制都會直接轉到 catch 語句,而不會執行其他 try 塊程式碼。

示例 1:過多的 try-catch 塊

在下面的示例中,我們添加了四個 try-catch 塊。我們從每個 try-catch 塊丟擲帶有不同訊息的錯誤。

使用者可以在輸出中看到從每個 catch 塊列印的錯誤訊息。

try {
   console.log("Inside the first try block");
   throw new Error("first error message");
} catch (error) {
   console.log(error.message);
}

try {
   console.log("Inside the second try block");
   throw new Error("second error message");
} catch (error) {
   console.log(error.message);
}

try {
   console.log("Inside the third try block");
   throw new Error("Third error message");
} catch (error) {
   console.log(error.message);
}

try {
   console.log("Inside the fourth try block");
   throw new Error("Fourth error message");
} catch (error) {
   console.log(error.message);
}

編譯後,它將生成以下 JavaScript 程式碼。

try {
   console.log("Inside the first try block");
   throw new Error("first error message");
}
catch (error) {
   console.log(error.message);
}
try {
   console.log("Inside the second try block");
   throw new Error("second error message");
}
catch (error) {
   console.log(error.message);
}
try {
   console.log("Inside the third try block");
   throw new Error("Third error message");
}
catch (error) {
   console.log(error.message);
}
try {
   console.log("Inside the fourth try block");
   throw new Error("Fourth error message");
}
catch (error) {
   console.log(error.message);
}

輸出

以上程式碼將產生以下輸出 –

Inside the first try block
first error message
Inside the second try block
second error message
Inside the third try block
Third error message
Inside the fourth try block
Fourth error message

從以上示例中,使用者可以理解當我們在單個程式碼中使用過多的 try-catch 語句時,程式碼如何變得難以閱讀和不清楚。

現在,我們將學習如何使用單個 try-catch 塊來處理具有不同錯誤的多個程式碼塊。

示例 2

在下面的示例中,我們建立了 solveProblems() 函式。它以函式作為引數,並在 try 塊中呼叫該函式。如果函式丟擲任何錯誤,我們可以在單個塊中捕獲它。

function func2() {
   throw new Error("This error is from second function!");
}

function func3() {
   let num = 10;
   num.toPrecision(1000);
}
function solveProblems(func: any) {
   // calling the callback function in the try block
   try {
      func();
   } catch (error) {
      console.log(error.message);
   }
}

// calling functions
solveProblems(func2);
solveProblems(func3);

編譯後,它將生成以下 JavaScript 程式碼 −

function func2() {
   throw new Error("This error is from second function!");
}
function func3() {
   var num = 10;
   num.toPrecision(1000);
}
function solveProblems(func) {
   // calling the callback function in the try block
   try {
      func();
   }
   catch (error) {
      console.log(error.message);
   }
}
// calling functions
solveProblems(func2);
solveProblems(func3);

輸出

以上程式碼將產生以下輸出 –

This error is from second function!
toPrecision() argument must be between 1 and 100

從以上示例中,使用者可以理解如何透過用單個 try-catch 塊替換它來移除多個 try-catch 塊。使用者只需要為每個單獨的程式碼塊建立一個單獨的函式,並且可以在單個 try 塊中依次呼叫每個函式。

更新於: 2023年2月21日

953 次瀏覽

開啟您的 職業生涯

透過完成課程獲得認證

開始學習
廣告

© . All rights reserved.