
Learn how to extend JavaScript’s Error class correctly, build error hierarchies, and wrap exceptions for clean, scalable error handling.
Martin Ferret
March 17, 2026
JavaScript allows throwing any value, but that flexibility often leads to unstructured and fragile error handling. Strings and generic Error instances don’t scale well in real applications.
Custom errors give failures meaning. They allow you to model domain-specific problems, handle them predictably, and keep error handling readable as your codebase grows.
Error CorrectlyThe built-in Error class already provides everything you need: a message, a name, and a stack trace. Extending it properly is simple but must be done correctly.
class ValidationError extends Error {
constructor(message) {
super(message);
this.name = "ValidationError";
}
}
Calling super(message) is mandatory. Without it, the error is not initialized correctly. The name property must also be set explicitly, otherwise it remains "Error".
function parseUser(json) {
const user = JSON.parse(json);
if (!user.name) {
throw new ValidationError("Missing field: name");
}
return user;
}
try {
parseUser('{ "age": 30 }');
} catch (err) {
if (err instanceof ValidationError) {
console.error(err.message);
} else {
throw err;
}
}
Using instanceof is reliable, expressive, and compatible with inheritance.
As applications grow, errors naturally form hierarchies.
class PropertyRequiredError extends ValidationError {
constructor(property) {
super(`Missing property: ${property}`);
this.name = "PropertyRequiredError";
this.property = property;
}
}
This allows you to catch:
Manually assigning name in every class becomes repetitive. A common pattern is to centralize it.
class AppError extends Error {
constructor(message) {
super(message);
this.name = this.constructor.name;
}
}
class ValidationError extends AppError {}
class PropertyRequiredError extends ValidationError {}
This keeps error classes short and consistent.
Low-level errors should not leak across abstraction boundaries. Wrapping exceptions solves this.
class ReadError extends Error {
constructor(message, cause) {
super(message);
this.name = "ReadError";
this.cause = cause;
}
}
function readUser(json) {
try {
const user = JSON.parse(json);
if (!user.name) throw new ValidationError("Missing name");
return user;
} catch (err) {
if (err instanceof SyntaxError || err instanceof ValidationError) {
throw new ReadError("Failed to read user", err);
}
throw err; // programming errors bubble up
}
}
try {
readUser("{ bad json }");
} catch (err) {
if (err instanceof ReadError) {
console.error(err.message);
console.error("Cause:", err.cause);
}
}
The caller now handles a single, meaningful error type, while still having access to the original failure.
Wrap errors when:
Do not wrap unknown or programming errors blindly. Rethrow them.
Clean error handling is not about more code.
It’s about expressing intent and maintaining control.
Extend Error properly, build clear hierarchies, and wrap exceptions when abstractions change.
Your future self, and your teammates will thank you.
Get the latest news and updates on developer certifications. Content is updated regularly, so please make sure to bookmark this page or sign up to get the latest content directly in your inbox.

Building a Vue Career in the Age of AI Coding Tools
How Junior Vue Developers Can Get Hired in 2026 and and what companies are looking for
Reza Baar
Aug 12, 2026

How YouTube Works, and Why It Plays in One Second
How does YouTube start almost any video in about a second? Here's the architectural bet behind it, and why the real call still belongs to you.
Alex Garrett-Smith
Aug 12, 2026

Nuxt 3 hits End Of Life
Nuxt 3 Hits EOL July 31, 2026: Your Staged Path to Nuxt 5 What the Nuxt 3 end-of-life date means, how to migrate through Nuxt 4, and when it makes sense to wait for Nuxt 5 instead.
Reza Baar
Aug 12, 2026