How do I fix: 🔍 Why This Happens?

The root cause of this issue lies in how TypeScript handles inheritance and prototype chaining when extending built-in classes like Error.When a class extends Error, it doesn't create a new instance of the Error class but rather inherits its properties and behavior.

How do I fix: Using a wrapper function to create the custom error class?

Step 1: Alternatively, you can use a wrapper function to create a new instance of Error and set its name property.Step 2: Create a new class that extends Object (which is the base class for all objects in JavaScript) instead of Error.Step 3: Use this new class as a wrapper around Error by calling it

Coding⏱️ 3 min read📅 2026-06-04

How to Fix: Typescript - Extending Error class

Q: Step-by-Step Verified Fixes Using the `name` property to set the custom error class name?

Step 1: To resolve this issue, you can use the `name` property to explicitly set the custom error class name when extending Error.Step 2: In your CustomError class, add the line `this.name = 'CustomError';` to the constructor to ensure that the correct class name is printed in the console.Step 3: He

TS error handling with custom class name

Quick Answer: Use the `name` property in your constructor to set a custom name for the error, e.g. `this.name = 'CustomError';

📋 Table of Contents

🔍 Why This Happens
🛠️ Step-by-Step Verified Fixes
✨ Wrapping Up

The issue you're experiencing occurs when trying to throw a custom error with a specific class name printed in the console. This affects developers who want to create their own custom error classes.

This problem can be frustrating because it prevents developers from fully utilizing TypeScript's features, such as creating custom error classes. In this guide, we'll walk you through the steps to resolve this issue using TypeScript.

🔍 Why This Happens

The root cause of this issue lies in how TypeScript handles inheritance and prototype chaining when extending built-in classes like Error.
When a class extends Error, it doesn't create a new instance of the Error class but rather inherits its properties and behavior.

🛠️ Step-by-Step Verified Fixes

Using the `name` property to set the custom error class name

Step 1: To resolve this issue, you can use the `name` property to explicitly set the custom error class name when extending Error.
Step 2: In your CustomError class, add the line `this.name = 'CustomError';` to the constructor to ensure that the correct class name is printed in the console.
Step 3: Here's an example of how this should look: `class CustomError extends Error { constructor(message: string) { super(`Lorem '${message}' ipsum dolor.`); this.name = 'CustomError'; } }`

Using a wrapper function to create the custom error class

Step 1: Alternatively, you can use a wrapper function to create a new instance of Error and set its name property.
Step 2: Create a new class that extends Object (which is the base class for all objects in JavaScript) instead of Error.
Step 3: Use this new class as a wrapper around Error by calling it with `new CustomError(message)` when throwing an error, like so: `throw new (class { constructor(message: string) { super(`Lorem '${message}' ipsum dolor.`); } })('foo');`

✨ Wrapping Up

By following these steps, you should be able to throw a custom error with your class name printed in the console instead of Error. Remember to use the `name` property or create a wrapper function to achieve this.

Did this fix your problem?

If not, try searching for specific error codes.

🔍 Search Error Database

❓ Frequently Asked Questions

🛠️ Related Fixes

How to Fix: Stuck in tutorial hell after 4 years: How do I b

Fix Stuck in tutorial hell after 4 years: How do I bui. Practice build

How to Fix: Trying to sync mutliple audio tracks to a movie

Fix Trying to sync mutliple audio tracks to a movie bu. Consider using

How to Fix: Failed to merge latest branches from upstream re

Fix Failed to merge latest branches from upstream repo. Try running 'g