All topics
42 / 100
Objectsintermediate

ES6 Classes and Inheritance

The class syntax as syntactic sugar over prototype-based inheritance, including extends, super, and static members.

ES6 classes gave JavaScript a familiar, class-like syntax for defining objects and inheritance, but it's important to understand — and interviewers will ask — that this is purely syntactic sugar over the same prototype chain mechanism that existed before, not a fundamentally new object model. Classes make constructor functions and prototype method assignment more readable, without changing what's actually happening underneath.

ES6 classes are like a nicer, pre-printed form for something you could always do with a blank sheet of paper (constructor functions and manual prototype linking) — the form is easier to fill out correctly, but it produces the exact same filing structure underneath.

Key Concepts

1
A class declaration defines a constructor method (called automatically by new), along with instance methods that are placed on the class's .prototype object, exactly like manually assigning methods to a constructor function's prototype in the older style. extends sets up the prototype chain between a subclass and its parent, so class Dog extends Animal {} makes Dog.prototype's prototype equal to Animal.prototype, enabling instances of Dog to inherit methods defined on Animal.
classconstructornew.prototypeextends
2
super has two distinct uses: inside a subclass's constructor, super(...) calls the parent class's constructor, which must happen before this can be used in the subclass constructor — omitting it throws a ReferenceError the moment you try to reference this. Inside any subclass method, super.methodName() calls the parent class's version of that method explicitly, useful for extending rather than completely replacing inherited behavior.
superconstructorsuper(...)thisReferenceError
3
static methods and properties belong to the class itself rather than to instances (Animal.compare() rather than dog.compare()), useful for utility functions logically related to the class but not tied to any particular instance. Class bodies are always executed in strict mode automatically, and unlike function declarations, class declarations are not hoisted in a usable way — referencing a class before its declaration throws due to the temporal dead zone, just like let/const.
staticAnimal.compare()dog.compare()letconst
Use cases:classesinheritanceoop