How to increase multiple try-catch readability in JavaScript ?
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!!....
Last Updated :
18 Jul, 2022
Like Article
Save Article
Share your thoughts in the comments
Please Login to comment...