7.1 Basics of Inheritance
Class inheritance in JavaScript lets you create new classes based on existing ones, reusing and extending their functionality. It's a key aspect of object-oriented programming (OOP) that allows the creation of class hierarchies and management of object behaviors.
The keyword extends
is used for class inheritance. The class that inherits another class is called the derived class (subclass), and the class from which it inherits is called the base class (superclass).
Example:
class Animal {
constructor(name) {
this.name = name;
}
speak() {
console.log(`${this.name} makes a noise.`);
}
}
class Dog extends Animal {
speak() {
console.log(`${this.name} barks.`);
}
}
const dog = new Dog('Rex');
dog.speak(); // "Rex barks."
Explanation:
- The
Animal
class is a base class with a constructor and aspeak()
method. - The
Dog
class inherits fromAnimal
and overrides thespeak()
method. - The
dog
instance of theDog
class uses the overriddenspeak()
method.
7.2 The super Keyword
The super
keyword is used to call the constructor or methods of the base class from the derived class.
1. Calling the Base Class Constructor
The derived class must call the base class constructor using super()
before using this
.
Example:
The Dog
constructor calls super(name)
to initialize the name property of the base Animal
class.
class Animal {
constructor(name) {
this.name = name;
}
speak() {
console.log(`${this.name} makes a noise.`);
}
}
class Dog extends Animal {
constructor(name, breed) {
super(name);
this.breed = breed;
}
speak() {
console.log(`${this.name} barks.`);
}
}
const dog = new Dog('Rex', 'Labrador');
console.log(dog.name); // "Rex"
console.log(dog.breed); // "Labrador"
dog.speak(); // "Rex barks."
2. Calling Base Class Methods
Base class methods can be called from the derived class using super
.
Example:
The speak()
method of the Dog
class calls the speak()
method of the base Animal
class using super.speak()
, then adds its own logic.
class Animal {
constructor(name) {
this.name = name;
}
speak() {
console.log(`${this.name} makes a noise.`);
}
}
class Dog extends Animal {
speak() {
super.speak(); // Call the base class method
console.log(`${this.name} barks.`);
}
}
const dog = new Dog('Rex');
dog.speak();
// "Rex makes a noise."
// "Rex barks."
7.3 Inheritance and Method Overriding
Inheritance lets derived classes override methods of the base class. This allows for altering or extending the functionality of the methods.
Example:
The speak()
method of the Dog
class overrides the speak()
method of the base Animal
class, providing its own implementation.
class Animal {
constructor(name) {
this.name = name;
}
speak() {
console.log(`${this.name} makes a noise.`);
}
}
class Dog extends Animal {
speak() {
console.log(`${this.name} barks.`);
}
}
const animal = new Animal('Generic Animal');
animal.speak(); // "Generic Animal makes a noise."
const dog = new Dog('Rex');
dog.speak(); // "Rex barks."
7.4 Inheritance and Additional Methods
A derived class can add new methods that do not exist in the base class.
Example:
The Dog
class adds a new fetch()
method, which does not exist in the base Animal
class.
class Animal {
constructor(name) {
this.name = name;
}
speak() {
console.log(`${this.name} makes a noise.`);
}
}
class Dog extends Animal {
speak() {
console.log(`${this.name} barks.`);
}
fetch() {
console.log(`${this.name} is fetching.`);
}
}
const dog = new Dog('Rex');
dog.speak(); // "Rex barks."
dog.fetch(); // "Rex is fetching."
7.5 Checking Inheritance
To check inheritance, you can use the instanceof
operator and the isPrototypeOf()
method.
Example:
The instanceof
operator checks if an object is an instance of a class. The isPrototypeOf()
method checks if an object's prototype is in the prototype chain of another object.
console.log(dog instanceof Dog); // true
console.log(dog instanceof Animal); // true
console.log(Animal.prototype.isPrototypeOf(Dog.prototype)); // true
GO TO FULL VERSION