How to increase multiple try-catch readability in JavaScript ?

Last Updated : 18 Jul, 2022

In this article, we will try to understand how we may increase the readability of multiple try/catch blocks in JavaScript with the help of certain coding examples.

Let us first understand the fact that how we may declare a simple try/catch block (though multiple in number) and also how we may throw an error with the help of the following enlightened syntaxes.

Syntax: Following shown is the syntax by which we may declare multiple try/catch blocks in JavaScript:

 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...

The following shown syntax shows show we may throw an error in JavaScript:

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

Let us now have a look over the following enlightened section containing coding examples where at first, we will see how we may create multiple try/catch blocks, and then laterwards we will see how we may avoid such blocks in order to increase their readability to any of its users.

Example 1:

In this example, we will declare multiple try/catch blocks inside the main function.
Inside those multiple try/catch blocks we will add as well catch several methods thrown error one after the another.
Further after catching all the thrown errors by different functions, we will call our main function which will display all the error messages.

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>

Output:

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

Example 2:

In this example, we will take into account the same function as developed in the previous example but here we will not create multiple try/catch blocks as we did in the previous example.
Here we will use the concept of the callback function (a function that is passed in as an argument in another function for execution).
Here we will declare a Wrapper function (helper function) inside which we will pass two parameters first one includes the callback function and another parameter includes the error message.
Inside that Wrapper function, we will declare one try/catch block only inside which callback function containing the error message is called, and its error is further cached in the catch block itself.
In the main function, we will call our Wrapper function inside which we will pass the function itself and the error message for the function as an argument.
In the end, we will store each result in different variables itself and print the result in the browser’s console.

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>

Output:

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

How to restart Node.js application when uncaught exception happen ?

amansingla

Improve

Article Tags :

How to increase multiple try-catch readability in JavaScript ?

Javascript

Javascript

Similar Reads

Thank You!

What kind of Experience do you want to share?