How does class inheritance work?
By FrontendPro Editorial Team Updated 9/26/2026
Answer
extends links one class to another so instances of the child can use the parent's methods, and super reaches the parent's version.
class Animal {
constructor(name) {
this.name = name;
}
describe() {
return `${this.name} makes a sound`;
}
}
class Dog extends Animal {
constructor(name, breed) {
super(name); // must come before using `this`
this.breed = breed;
}
describe() {
return `${super.describe()}, specifically a bark`;
}
}
new Dog("Bolt", "corgi").describe();
// "Bolt makes a sound, specifically a bark"
Two rules about super
In a child constructor, super(...) calls the parent constructor and must run before you touch this — the instance does not exist until then. Omitting it entirely throws a ReferenceError. If a child declares no constructor at all, JavaScript supplies one that forwards every argument to the parent.
Inside methods, super.method() calls the parent's implementation, which is how you extend behaviour rather than replace it.
What it is underneath
None of this is a separate inheritance model — it is the prototype chain with nicer syntax. Dog.prototype's prototype is Animal.prototype, so a method missing on the first is found on the second. Methods live on the prototypes, shared by all instances; only fields set in the constructor live on the object itself.
Worth knowing
- Static methods are inherited too, and
superworks in them. instanceoffollows the whole chain: aDogis also anAnimal.- You can
extendsbuilt-ins such asErrororArray, which is the clean way to define custom error types. - Prefer composition when the relationship is not genuinely "is a" — deep class hierarchies get rigid quickly.
