JS Custom Errors
A custom error is an error type with your own name and details, like a special warning sign made for your own house. It makes problems easier to spot and handle.
In this page:
Syntax
class CustomError extends Error {
constructor(message) {
super(message);
this.name = "CustomError";
}
}
throw new CustomError("message");Creating Custom Errors
You create a custom error type by extending the built-in Error class, which gives your new error inherited behavior like a message property and a proper stack trace, while letting you add your own fields on top.
उदाहरण: Creating Custom Errors
// Define the class `ValidationError`, inheriting from `Error`
// Define the class `ValidationError`, inheriting from `Error`
class ValidationError extends Error {
// Constructor taking `message`, runs when a new instance is created
// Constructor taking `message`, runs when a new instance is created
constructor(message) {
// Call `super(message)`
// Call `super(message)`
super(message);
// Assign "ValidationError" to `this.name`
// Assign "ValidationError" to `this.name`
this.name = "ValidationError";
}
}
// Try running this block; jump to `catch` if it throws
// Try running this block; jump to `catch` if it throws
try {
// Throw a new `ValidationError` with message "Invalid email"
// Throw a new `ValidationError` with message "Invalid email"
throw new ValidationError("Invalid email");
// Catch any error, bound to `e`
// Catch any error, bound to `e`
} catch (e) {
// Print `e.name, e.message` to the console
// Print `e.name, e.message` to the console
console.log(e.name, e.message);
}Adding Extra Information
A custom error class can accept extra constructor arguments and store them as additional properties, letting catch blocks access structured details beyond a plain message string.
उदाहरण: Adding Extra Information
// Define the class `ValidationError`, inheriting from `Error`
// Define the class `ValidationError`, inheriting from `Error`
class ValidationError extends Error {
// Constructor taking `message`, `field`, runs when a new instance is created
// Constructor taking `message`, `field`, runs when a new instance is created
constructor(message, field) {
// Call `super(message)`
// Call `super(message)`
super(message);
// Assign "ValidationError" to `this.name`
// Assign "ValidationError" to `this.name`
this.name = "ValidationError";
// Assign `field` to `this.field`
// Assign `field` to `this.field`
this.field = field;
}
}
// Try running this block; jump to `catch` if it throws
// Try running this block; jump to `catch` if it throws
try {
// Throw a new `ValidationError` with message "Required field", "email"
// Throw a new `ValidationError` with message "Required field", "email"
throw new ValidationError("Required field", "email");
// Catch any error, bound to `e`
// Catch any error, bound to `e`
} catch (e) {
// Print `e.field, e.message` to the console
// Print `e.field, e.message` to the console
console.log(e.field, e.message);
}Catching Custom Errors
Because a custom error still extends Error, existing try/catch code keeps working; you can also check error instanceof YourErrorClass to handle that specific error type differently.
उदाहरण: Catching Custom Errors
class ValidationError extends Error {}
// Try running this block; jump to `catch` if it throws
// Try running this block; jump to `catch` if it throws
try {
// Throw a new `ValidationError` with message "Bad input"
// Throw a new `ValidationError` with message "Bad input"
throw new ValidationError("Bad input");
// Catch any error, bound to `e`
// Catch any error, bound to `e`
} catch (e) {
// Print `e instanceof ValidationError` to the console
// Print `e instanceof ValidationError` to the console
console.log(e instanceof ValidationError);
// Print `e instanceof Error` to the console
// Print `e instanceof Error` to the console
console.log(e instanceof Error);
}Custom Error Use Cases
Custom errors are useful when different failure categories need different handling — for example, a ValidationError versus a NetworkError might trigger completely different UI responses.
उदाहरण: Custom Error Use Cases
class ValidationError extends Error {}
class NetworkError extends Error {}
// Define the function `handle` taking `err`
// Define the function `handle` taking `err`
function handle(err) {
if (err instanceof ValidationError) console.log("Show form message");
else if (err instanceof NetworkError) console.log("Retry request");
}
// Call `handle(new NetworkError("timeout"))`
// Call `handle(new NetworkError("timeout"))`
handle(new NetworkError("timeout"));Custom Error Best Practices
Name custom error classes clearly (ending in Error by convention) and keep their extra properties minimal and well-documented so other developers know what to expect when catching them.
उदाहरण: Custom Error Best Practices
// Define the class `OutOfStockError`, inheriting from `Error`
// Define the class `OutOfStockError`, inheriting from `Error`
class OutOfStockError extends Error {
// Constructor taking `item`, runs when a new instance is created
// Constructor taking `item`, runs when a new instance is created
constructor(item) {
// Call `super(`${item} is out of stock`)`
// Call `super(`${item} is out of stock`)`
super(`${item} is out of stock`);
// Assign "OutOfStockError" to `this.name`
// Assign "OutOfStockError" to `this.name`
this.name = "OutOfStockError";
// Assign `item` to `this.item`
// Assign `item` to `this.item`
this.item = item;
}
}
// Try running this block; jump to `catch` if it throws
// Try running this block; jump to `catch` if it throws
try {
// Throw a new `OutOfStockError` with message "Widget"
// Throw a new `OutOfStockError` with message "Widget"
throw new OutOfStockError("Widget");
// Catch any error, bound to `e`
// Catch any error, bound to `e`
} catch (e) {
// Print `e.name, e.item` to the console
// Print `e.name, e.item` to the console
console.log(e.name, e.item);
}Live Example
Related Topics
{# common_mistakes/chapter_summary/browser_support: on Hindi pages the
view already swaps in the hi_ translation fields (or blanks these
out if untranslated), so this renders correctly for both languages
without a lang_code check here. #}
🔒
Chapter Quiz — Complete all 6 topics to unlock
0/6 topics done
Complete these topics first: