Introduction

This is the second part of the post on handling errors, the first part is here. In this part we will see how to handle errors gracefully.

Handling errors gracefully

JavaScript provides built-in methods, try, catch, and finally to help you deal with errors gracefully. The try statement allows you to test a block of code for errors. The catch statement lets you handle the error. The finally statement lets you execute code, after try and catch, regardless of the result.

Let’s say we had to handle JSON data from an imaginary thirdParty called “Umbrella”. Umbrella is a leading lab genetics research company. Below is a simple example:

// Mock JSON data returned from server

let response = '{"data": [
  {"patientName": "Wesker", "bloodType": "A", "sample": "Ouroboros", "state": "Ohio"},
  {"patientName": "jill", "bloodType": "B", "sample": "None", "state": "New Jersey"}]
}';

if (response) {
  try {
    let data = JSON.parse(response);
    console.log(data);
  } catch (error) {
    let errorMessage = _Error: ${error.message}_;
    console.log(errorMessage);
  }
  finally {
    console.log("Finally block always executes");
  }
}

In the example above, the try statement may throw an error. The catch statement contains code that executes if an error occurs. The finally statement executes regardless of whether an error occurred.

If an error occurs in the try statement, the catch statement is executed. If no error occurs, the catch statement is skipped.

If an error occurs in the try or catch statement, the finally statement is executed. If no error occurs, the finally statement is executed anyway.

Creating your own error objects

There are two ways to create custom error objects:

The first way is to use the Error constructor. This takes two arguments: the name of the error, and a description of the error. For example:

// Best if it's a through descriptive error message
let myError = new Error('Something went wrong!')

The second way is to use the throw keyword. This keyword takes an error object as an argument and throws it, which will cause the program to stop running. For example:

// Best if it's a through descriptive error message
throw new Error('Something went wrong!')

Both of these methods will create an error object with a name and description. However, the throw keyword will also cause the program to stop running, which may not be what you want.

Once you have created an error object, you can use it to provide feedback to the user or application. For example, you could display an error message to the user:

alert('Something went wrong!')

Or you could log the error to the console:

console.log('Something went wrong!')

Some common problems that benefit from error handling

When there is a formatting error in the JSON data, numeric data that might not have a numeric value in one of it’s properties, an error from a remote server, or a set of data with one missing value.

Some practical tips

Some ways to try to debug errors are: using a different browser, commenting out chunks of code, explaining the code to someone else, Googling it, Stack Overflow, asking about the error on github (and linking to a code playground), using VS validation extensions like ESLint, and finally just using the console.

Ending Thoughts

Handling errors gracefully is important to provide a good user experience and to avoid unexpected behaviors. By anticipating errors and creating custom error objects, you can ensure robustness and errors handle in a way that prevents technical debt. try, catch, and finally are powerful statements for handling errors gracefully. By using try, catch, and finally, you can ensure that your code is executed regardless of whether an error occurs.