Skip to main content

Command Palette

Search for a command to run...

Error Handling in JavaScript:

Updated
3 min read
Error Handling in JavaScript:
V
Blog on different tools and technology or concept that useful for the begineer that start their jouney in software industry

Imagine you're building a web application, everything looks perfect… and suddenly — it crashes. No warning, no message, just a broken experience for the user.

This is where error handling in JavaScript becomes crucial.

Errors are inevitable in programming, but how you handle them defines the quality and reliability of your application. In this blog, we’ll explore how JavaScript manages errors using try, catch, finally, and custom error handling techniques.


What Are Errors in JavaScript?

Errors are unexpected situations that occur during code execution. These are also known as runtime errors.

Example:

console.log(user.name); // user is not defined

This will throw a ReferenceError, and your program will stop execution.

Common types of errors:

  • Syntax Error – Mistakes in code structure

  • Reference Error – Using undefined variables

  • Type Error – Wrong data type usage


Using try and catch Blocks

JavaScript provides a structured way to handle errors using try...catch.

Syntax:

try {
    // risky code
} catch (error) {
    // handle error
}

Example:

try {
    let result = 5/0;
} catch (error) {
    console.log("Something went wrong:", error.message);
}

Instead of crashing, the program handles the error gracefully.


Graceful Failure (Why It Matters)

Graceful failure means your application does not break completely, even when something goes wrong.

Instead of showing:

App crashed ✗

You can show:

Something went wrong. Please try again later. ✔

The finally Block

The finally block always executes — whether an error occurs or not.

Syntax:

try {
    // code
} catch (error) {
    // handle error
} finally {
    // always runs
}

Example:

try {
    console.log("Trying...");
} catch (error) {
    console.log("Error occurred");
} finally {
    console.log("Execution finished");
}

Throwing Custom Errors

You can create your own errors using the throw keyword that is meaningful.

Example:

function withdraw(amount) {
    if (amount > 1000) {
        throw new Error("Insufficient balance");
    }
    return "Transaction successful";
}

try {
    withdraw(1500);
} catch (error) {
    console.log(error.message);
}

Why Error Handling Matters

Error handling is not just about avoiding crashes — it's about building robust applications.

Key Benefits:

  • Easier debugging

  • Prevents application crashes

  • Better user experience

  • Cleaner and maintainable code


Conclusion

  • Use try/catch/finally to contain runtime problems and clean up resources.

  • Throw meaningful (custom) Error types so callers can react appropriately.

  • For async code, prefer async/await with try/catch or always attach rejection handlers.

  • Show user-friendly messages, log technical details for debugging, and centralize monitoring/handlers.