How to solve too many try catch in Typescript ?

In this article, we will try to see how we actually write too many try/catch blocks for catching multiple errors in TypeScript, and further, we will try to understand by which technique we may be able to reduce the overhead of writing too many try/catch blocks, with the help of certain coding examples. The try-catch statement contains the try-block with the catch-block or finally-block or contains both the block. The try-block will be first executed, the catch-block will only execute if an exception is thrown. The final block always executes before exiting the control flow from the entire code.

Need of try/catch blocks:

• In simple words, we need try/catch blocks in order to catch all the errors which we receive from different functions.
• Catching those errors improves our code’s performance and hence the readability as well. 
• Multiple try/catch blocks are required in order to catch multiple errors from multiple functions one after the other.

Syntax:

try {
    // Here we will all those variables or methods...
    // which tends to cause error or exception laterwards...
}

catch(error_variable){
    // do something with the error_variable...
    // either handle it or print it as per need...
}
...
// Many more such blocks could be added as per need....

Let’s see the following illustrations which will help us to understand how many too many try/catch blocks could be created as well as will see the better version instead of too many try/catch blocks.

Example-1: In this example, we will create multiple try/catch blocks in order to catch multiple errors from different functions which actually throw different errors individually, and at the end, we will try to print those error messages one after the other.

Javascript

let first_function = (content: string): any => {
    throw new Error(content);
}

let second_function = (content: string): any => {
    throw new Error(content);
}

let third_function = (content: string): any => {
    throw new Error(content);
}

let main_function = (): any => {
    try {
        let result = first_function(
            "Error 404 !!....");
        console.log(result);
    }
    catch (error) {
        console.log(error.message)
    }

    try {
        let result = second_function(
            "Something went wrong!!....");
        console.log(result);
    }
    catch (error) {
        console.log(error.message)
    }

    try {
        let result = third_function(
            "Please try again later!!....");
        console.log(result);
    }
    catch (error) {
        console.log(error.message)
    }
}
main_function();

Output:

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

From the above example, the multiple try/catch blocks addition actually makes the code look bigger and its readability also gets reduced to some extent which any user doesn’t wish to opt for.

Now in another example, we will try to understand the other way possible in order to catch multiple functions’ thrown errors without the usage of multiple try/catch blocks, like analyzing the other way out in order to reduce the overhead of multiple try/catch blocks. Here, we will use the concept of the callback function (a function that is passed in inside another function as an argument, which is further executed after the completion of the first function which is the main function itself). We will use a callback function that is responsible for catching the error thrown by each method inside the try block that will be declared inside a Wrapper Function (also termed as helper function) through which we will catch all the errors of all functions one after the another.

Example 2: In this example, we will use the callback function with try/catch blocks, in order to handle the exception thrown.

Javascript

let first_function = (content: string): any => {
    throw new Error(content);
};

let second_function = (content: string): any => {
    throw new Error(content);
};

let third_function = (content: string): any => {
    throw new Error(content);
};

let catchAllErrors = (callback: any, content: string): any => {
    try {
        callback(content);
    } catch (error) {
        return error;
    }
};

let main_function = () => {

    let error_1 = catchAllErrors(first_function,
        "Error 404!!...");
    let error_2 = catchAllErrors(second_function,
        "Something went wrong!!...");
    let error_3 = catchAllErrors(third_function,
        "Please try again later!!....");

    console.log("First Error: " + error_1);
    console.log("Second Error: " + error_2);
    console.log("Third Error: " + error_3);
};
main_function();

Output:

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