Method Overriding

Method overriding in JavaScript involves redefining a method in a child class that was already defined in its parent class.

This allows the child class to provide a specific implementation of the method while inheriting the rest of the parent class's behavior.

// Parent class
class Animal {
  speak() {
    return "Animal speaks";
  }
}

// Child class
class Dog extends Animal {
  // Overriding the speak method of the parent class
  speak() {
    return "Dog barks";
  }
}

// Child class
class Cat extends Animal {
  // Overriding the speak method of the parent class
  speak() {
    return "Cat meows";
  }
}

// Creating instances of the classes
const animal = new Animal();
const dog = new Dog();
const cat = new Cat();

// Calling the speak method on instances
console.log(animal.speak()); // Output: "Animal speaks"
console.log(dog.speak());    // Output: "Dog barks"
console.log(cat.speak());    // Output: "Cat meows"

In this example:

• The Animal class has a method speak() that returns a generic string.

• The Dog class extends Animal and overrides the speak() method to return "Dog barks".

• The Cat class extends Animal and overrides the speak() method to return "Cat meows".

When you create instances of Animal, Dog, and Cat and call the speak() method on each instance:

• For the Animal instance, it invokes the speak() method from the parent class returning "Animal speaks".

• For the Dog instance, it invokes the overridden speak() method in the Dog class returning "Dog barks".

• For the Cat instance, it invokes the overridden speak() method in the Cat class returning "Cat meows".

This demonstrates how method overriding works in JavaScript, allowing child classes to provide their own implementation of methods defined in their parent classes.