The exciting way to handle JavaScript error

Taher Mamun
4 min readMay 6, 2021

Every Programmer faced many errors in his programming life. From the beginner to the advanced level. It is a very occurs for every programmer. Today, I will explain handling JavaScript Errors. JavaScript has many ways to handle errors but, today we will explore the “try…catch” error handling method.

What is JavaScript Error?

Most internet users have encountered annoying JavaScript errors at some stage. This happens when a script in a web page contains an error or fails to execute correctly. Exactly what happens depends on the browser and type of error, but in most cases, some sort of error notification will be displayed.

There are two types of JavaScript error:

  • Syntax Error: Occurs when there is a mistake in the way the code is written; for example, a typo or missing character.
  • Runtime error: Occurs when the script is unable to complete its instructions; for example, if a specified object cannot be found.

The “try..catch” syntax

This syntax has two main blocks: try, and catch.

The Flowcharts work:

  1. First, the try block will be executed.
  2. If the try block doesn't execute.it simply ignores and start to execute catch block. But, If try block executes that means there is no error in this code.

try...catch only works for only runtime errors

A program during execution is called runtime errors.try...catch to work, the code must be runnable. In other words, it should be valid JavaScript code. It won’t work if the code is syntactically wrong.

try...catch works synchronously

If we use “scheduled” code, like in setTimeout, then try...catch won’t catch it:

It’s happened Because the function executed later when the engine has already left the try…catch method. To catch an exception inside a scheduled function, try...catch must be inside that function:

Error Object

When an error occurs, JavaScript generates an object and it’s passed as an argument to catch.

For all built-in errors, the error object has two main properties:

  1. name
  2. message

catch binding

If we don’t need any detailed information about the error, the catch may ignore it.

Using “try…catch”

Let’s go to explore a real-life example use case of try...catch.As we already know, JavaScript accepts the JSON.parse() method to read JSON values.

We mainly used to get the decoded data by using JSON parsing. A simple example of JSON is:

If the json is not correct, it generates an error.

Own Errors

Sometimes, you see that json is syntactically correct but you don’t have an occupation property. See this.

try…catch finally

The try…catch construct may have one more code clause. that is finally. If it exists, it runs in all cases in the try…catch method.
After the try, if there were no errors, and after the catch, if there were errors, finally will be executed.

Summary of this Article

The try...catch construct allows handling runtime errors. It literally allows to “try” running the code and “catch” errors that may occur in it. and finally will execute always. but you can ignore “finally”. It’s not necessary for use always for any code error handling.

Keep learning and practice more and more. error is a very bad thing for every developer. some developers might feel boring this thing. you can fix JavaScript errors if you learn this article and practice it.

--

--