javascript error handling try catch logo

JavaScript (JS) try { } catch { }: A Beginner Friendly Guide

JavaScript is an awesome programming language. It is the dominant language for front end web development. Also, it is used for back end with NodeJS. Let us see error handling in JavaScript with try { } catch { }.

In this blog post I will explain what is error handling and how we can leverage the try { } catch { } JavaScript to handle some of our errors.

What is error handling in JS ?

Have you ever seen something as shown in the image below ?

Chances are you most probably have. And this is known as un-handled exceptions.

I have purposefully raised some exceptions in the image above. But these kinds of exceptions will be thrown sometime in your code. And it is because of certain bugs or other race conditions.

Let us first understand various elements in the error handling realm.

try block

The try { } block in JavaScript holds the exception prone code. Meaning you have to always wrap the code that you think will produce some error.

Even if you are confident about the use cases you must wrap the doubtful portion.

Why should you use try block ?

It is because the browser will stop executing the code after where the error is found.


// this block is incomplete
try {
    x // is undefined we will handle the error in catch { }
}Code language: JavaScript (javascript)

catch block

The catch block is where the execution shifts if the interpreter finds any error.

And it is us who must handle how the execution will turn. We are provided with the reason for the exception.

Let us look at the syntax, but the syntax is not complete it’s only partial.

catch (exception) { // our code here }Code language: JavaScript (javascript)

Let us now head over to the finally { } block.

finally block

This block is the last block in our error handling. The interpreter will execute the code in this block regardless of the circustance.

Meaning, the block of code will no matter the exception is thrown or not. Now that we have understood this let us move forward.

Also Read: JavaScript forEach(): Iterate Through Array Smartly


The try { } catch { } syntax

Let us see the syntax for JavaScript try catch. Let us clear how the things look in code.

try {
    b // undefined
} catch (exception) {
} finally {
    console.log("try catch block executed.");
}Code language: JavaScript (javascript)

In the example above if our variable b is undefined. The exception will be logged in the console. And the code inside finally block will execute.

If the variable b is declared then only the finally block will be executed.

When to use try { } catch { } in JavaScript ?

This is a subjective question and it’s answer depends on what you are doing.

If you are simply taking input from user and printing it. There is really no use for try { } catch { }. But there could very well be.

If you are parsing a JSON string, there might be exceptions thrown. There you can use the try { } catch { }.

I have only provided the example for the use case. But in real projects it depends on what you are doing.

You can try and wrap your code with try catch.

Related Posts