JavaScript 如何提高多个try-catch的可读性

在本文中，我们将尝试通过一些编码示例来了解如何提高JavaScript中多个try / catch块的可读性。

首先让我们了解如何声明一个简单的try / catch块（尽管有多个），以及如何使用以下光辉语法抛出错误。

语法： 以下是我们可以在JavaScript中声明多个try / catch块的语法：

 try {
 
    // Here we will add all those variables
    // or methods which tends to or responsible
    // for causing error or exception laterwards
}

catch(error_variable){

    // Here we will do something with the 
    // error_variable either handle it or
    // print it as per need
}
...

// We may add many more such blocks 
// as per the requirement...

下面显示的语法展示了在JavaScript中如何抛出错误：

thrown new Error(errorMessage); 
// errorMessage is in the form of string itself

让我们现在看一下以下启示性部分，其中包含编码示例，首先，我们将看到如何创建多个try/catch块，然后我们将看到如何避免这些块，以增加其可读性。

示例1：

在这个示例中，我们将在主函数内声明多个try/catch块。
在这些多个try/catch块内，我们将连续添加捕获多个方法抛出的错误。
在捕捉到不同函数抛出的所有错误后，我们将调用我们的主函数，该函数将显示所有错误消息。

Javascript

<script> 
    let first_error_function = (errorMessage) => { 
        throw new Error(errorMessage); 
    }; 
  
    let second_error_function = (errorMessage) => { 
        throw new Error(errorMessage); 
    }; 
  
    let third_error_function = (errorMessage) => { 
        throw new Error(errorMessage); 
    }; 
  
    let catchingErrors = () => { 
        try { 
            let result = first_error_function( 
                "Error 404 !!...."); 
            console.log(result); 
        } catch (error) { 
            console.log(error.message); 
        } 
  
        try { 
            let result = second_error_function( 
                "Something went wrong!!...."); 
            console.log(result); 
        } catch (error) { 
            console.log(error.message); 
        } 
  
        try { 
            let result = third_error_function( 
                "Please try again later!!...."); 
            console.log(result); 
        } catch (error) { 
            console.log(error.message); 
        } 
    }; 
  
    catchingErrors(); 
</script>

输出：

Error 404 !!....
Something went wrong!!....
Please try again later!!....

示例2：

在这个示例中，我们将考虑与上一个示例中开发的相同函数，但是在这里我们不会创建多个try/catch块，就像在前面的示例中所做的那样。
在这里，我们将使用回调函数的概念（一个作为参数传递给另一个函数以执行的函数）。
在这里，我们将声明一个Wrapper函数（辅助函数），在其中我们将传递两个参数，第一个包括回调函数，第二个参数包括错误消息。
在Wrapper函数内部，我们只声明一个try/catch块，在其中调用包含错误消息的回调函数，并将其错误进一步捕获在catch块中。
在主函数中，我们将调用我们的Wrapper函数，在其中将函数本身和函数的错误消息作为参数传递。
最后，我们将把每个结果分别存储在不同的变量中，并在浏览器的控制台中打印结果。

JavaScript

<script> 
    let first_error_function = (errorMessage) => { 
        throw new Error(errorMessage); 
    }; 
  
    let second_error_function = (errorMessage) => { 
        throw new Error(errorMessage); 
    }; 
  
    let third_error_function = (errorMessage) => { 
        throw new Error(errorMessage); 
    }; 
  
    let catchingAllErrors = (callback, content) => { 
        try { 
            callback(content); 
        } catch (errorMessage) { 
            return errorMessage; 
        } 
    }; 
  
    let main_function = () => { 
        let error_1 = catchingAllErrors( 
            first_error_function, "Error 404!!..."); 
          
        let error_2 = catchingAllErrors( 
            second_error_function, 
            "Something went wrong!!..."
        ); 
      
        let error_3 = catchingAllErrors( 
            third_error_function, 
            "Please try again later!!...."
        ); 
      
        console.log("First Catched Error: " + error_1); 
        console.log("Second Catched Error: " + error_2); 
        console.log("Third Catched Error: " + error_3); 
    }; 
  
    main_function(); 
</script>

输出:

First Catched Error: Error: Error 404!!...
Second Catched Error: Error: Something went wrong!!...
Third Catched Error: Error: Please try again later!!....