What does the super() keyword do?

JavaScriptJunior~2 min read

1. `super()` in the Constructor: Calling the Parent

When one class inherits from another:

javascript

class Animal {
  constructor(name) {
    this.name = name;
  }
}

class Dog extends Animal {
  constructor(name, breed) {
    super(name); // calls Animal.constructor(name)
    this.breed = breed;
  }
}

What Happens Under the Hood:

Before super() is called, the this object does not exist yet.
Calling super(name) calls the parent's constructor (Animal) and creates this, which can now be used.
After that, you can assign fields on this.

javascript

const dog = new Dog("Rex", "Shepherd");
console.log(dog.name);  // "Rex"
console.log(dog.breed); // "Shepherd"

Important: `super()` Must Be Called Before `this`

If you try to use this before calling super(), JS throws an error:

javascript

class Dog extends Animal {
  constructor(name) {
    this.name = name; // ReferenceError
    super(name);
  }
}

Error:

ReferenceError: Must call super constructor before accessing 'this'

Why? Because super() creates the instance context (initializes this). Without it, this simply does not exist yet.

2. `super` Outside the Constructor: Accessing the Parent's Methods

super can be used not only in the constructor, but also in any class method to call the parent's method.

javascript

class Animal {
  speak() {
    console.log("The animal makes a sound");
  }
}

class Dog extends Animal {
  speak() {
    super.speak(); // calls the parent's method
    console.log("The dog barks");
  }
}

new Dog().speak();
// "The animal makes a sound"
// "The dog barks"

super.speak() is literally a call to Animal.prototype.speak.call(this).

3. `super` in Static Methods

If a class has static methods, super can be used there too, to access the parent's static members:

javascript

class Parent {
  static sayHi() {
    console.log("Hi from the parent");
  }
}

class Child extends Parent {
  static sayHi() {
    super.sayHi(); // calls Parent.sayHi()
    console.log("Hi from the child");
  }
}

Child.sayHi();
// Hi from the parent
// Hi from the child

4. What `super` Actually Does Under the Hood

Under the hood, super is a reference to the parent's prototype:

In regular methods → super points to Parent.prototype
In static methods → super points to Parent itself

So the call:

javascript

super.method()

is equivalent to:

javascript

Parent.prototype.method.call(this)

5. Example: Using `super` in an Inheritance Chain

javascript

class Animal {
  constructor(name) {
    this.name = name;
  }
  info() {
    return `Name: ${this.name}`;
  }
}

class Dog extends Animal {
  constructor(name, breed) {
    super(name); // calls Animal.constructor()
    this.breed = breed;
  }
  info() {
    return `${super.info()}, Breed: ${this.breed}`;
  }
}

const dog = new Dog("Rex", "Beagle");
console.log(dog.info()); // Name: Rex, Breed: Beagle

6. `super` and Arrow Functions

Arrow functions have no super of their own. They take it from the surrounding context:

javascript

class A {
  hello() {
    console.log("Hi from A");
  }
}

class B extends A {
  hello = () => {
    super.hello(); // works, because it takes super from the class
  };
}

new B().hello(); // "Hi from A"

But it's important to remember that arrow methods are created on the instance, not on the prototype (see the earlier explanation).

7. Errors From Incorrect Use

Calling super() in a class without extends:

javascript

class A {
  constructor() {
    super(); // SyntaxError
  }
}

super() can only be used inside a class that inherits from another one.

Summary

Where It's Used	What It Does
In the constructor	Calls the parent's constructor and creates `this`
In a method	Lets you call the parent's method (`super.method()`)
In a static method	Accesses the parent's static methods
Without `extends`	Error
Before `super()` is called	`this` is not accessible (error)

Short Answer

Interview ready

Premium

A concise answer to help you respond confidently on this topic during an interview.