Intermediate JavaScript

Error Handling

JavaScript and NodeJS Fundamentals

Error Handling

Common error: accessing a value on undefined
Throwing an error
Catching errors with try...catch
The finally block

As you write more complex JavaScript programs, you'll encounter errors. These are unexpected situations where something goes wrong. Maybe a variable is undefined but you try to use it, or some code receives the wrong type of input.

If we don’t handle these errors properly, our program might crash or behave in unpredictable ways. JavaScript provides tools to detect and manage these errors so we can handle them more gracefully.

Common error: accessing a value on undefined

Here’s a common situation that causes an error:

const user = undefined
console.log(user.name)

If you run this code, you’ll get an error that looks like this:

TypeError: Cannot read properties of undefined (reading 'name')

That’s JavaScript telling you: “Hey, you tried to get the name property from something that’s undefined, and that doesn't make sense.” And as you can see, when this kind of error happens, the program stops running unless you’ve specifically written code to catch and handle it.

throwing an error

Sometimes you want to manually raise an error in your code. In that case, you use the throw keyword.

throw new Error("This is a custom error message")

This immediately stops the program and prints:

Uncaught Error: This is a custom error message

You can use throw to enforce rules in your program. For example:

function divide(a, b) {
  if (b === 0) {
    throw new Error("You can't divide by zero")
  }
  return a / b
}

console.log(divide(10, 2))  // OK: prints 5
console.log(divide(10, 0))  // Error!

The second call causes an error because dividing by zero is not allowed in this example.

Catching errors with try...catch

If you don’t want your program to crash when an error occurs, you can catch the error using a try...catch block. This is helpful when you want your program to keep going even if something fails.

try {
  const user = undefined
  console.log(user.name)
  console.log("End of the block") // this will never get printed
} catch (error) {
  console.log("Oops! Something went wrong.")
}

Output:

Oops! Something went wrong.

Here’s how it works:

The code inside the try block is attempted first.
If an error occurs, JavaScript jumps to the catch block, skipping the rest of the try block.
The catch block receives the error, so you can print it, or handle it in some other way, like for example

try {
  const user = undefined
  console.log(user.name)
  console.log("End of the block") // this will never get printed
} catch (error) {
  console.log(`The message of the error was: "${error.message}"`)
}

Output:

The message of the error was: "Cannot read properties of undefined (reading 'name')"

The finally block

You can also add a finally block. This is code that always runs, whether there was an error or not.

try {
  console.log("Trying something risky...")
  throw new Error("Uh oh!")
} catch (error) {
  console.log("Caught the error:", error.message)
} finally {
  console.log("This will run no matter what.")
}

Output:

Trying something risky...
Caught the error: Uh oh!
This will run no matter what.