JavaScript Custom Errors

Written by Swapnil RajaPublished 24 Aug 2026

A custom error class describes a failure specific to your own program.

Extend the built-in Error class and give it a name.

Then the caller can tell your failures apart from everything else.

Example

javascript

class ValidationError extends Error {
  constructor(message) {
    super(message);
    this.name = "ValidationError";
  }
}

let name;
try {
  throw new ValidationError("name is required");
} catch (error) {
  name = error.name;
}

console.log(name);

PreviousJavaScript Error Types NextJavaScript Error Handling Patterns

Example

javascript

class ValidationError extends Error {
  constructor(message) {
    super(message);
    this.name = "ValidationError";
  }
}

const error = new ValidationError("bad input");

console.log(error instanceof ValidationError);
console.log(error instanceof Error);
console.log(error.message);

Example

javascript

class ValidationError extends Error {
  constructor(message, field) {
    super(message);
    this.name = "ValidationError";
    this.field = field;
  }
}

let details;
try {
  throw new ValidationError("is required", "email");
} catch (error) {
  details = error.field + " " + error.message;
}

console.log(details);

Example

javascript

class ValidationError extends Error {
  constructor(message) {
    super(message);
    this.name = "ValidationError";
  }
}

function handle(fn) {
  try {
    fn();
    return "worked";
  } catch (error) {
    return error instanceof ValidationError ? "show the user" : "log it as a bug";
  }
}

console.log(handle(function () { throw new ValidationError("bad"); }));
console.log(handle(function () { null.length; }));

Example

javascript

class AppError extends Error {}
class NotFoundError extends AppError {}

const error = new NotFoundError("no such user");

console.log(error instanceof NotFoundError);
console.log(error instanceof AppError);
console.log(error instanceof Error);

Complete Example

html

<!DOCTYPE html>
<html>
<head>
  <title>JavaScript Custom Errors</title>
</head>
<body>

  <h1>Custom Errors</h1>

  <p id="out"></p>

  <script>
    class ValidationError extends Error {
      constructor(message, field) {
        super(message);
        this.name = "ValidationError";
        this.field = field;
      }
    }

    function register(email) {
      if (!email) {
        throw new ValidationError("is required", "email");
      }
      return "registered";
    }

    const out = document.getElementById("out");

    try {
      out.textContent = register("");
    } catch (error) {
      if (error instanceof ValidationError) {
        out.textContent = "Problem with " + error.field + ": it " + error.message;
      } else {
        out.textContent = "Unexpected error";
      }
    }
  </script>

</body>
</html>

JavaScript Custom Errors

Example

Building One

Syntax

It Is Still an Error

Example

Carrying Extra Information

Example

Handling Your Own Separately

Example

Forgetting the Name

Example

A Small Hierarchy

Example

Complete Example

Try It Yourself

Important Points

Conclusion