menu

JavaScript/Typescript - 16 Topics

DEEP DIVE INTO

JavaScript/Typescript

Topic:inheritance

menu

Inheritance is a fundamental concept in object-oriented programming that allows a new class (subclass or derived class) to inherit properties and behaviors from an existing class (superclass or base class).

In TypeScript, you can implement inheritance using the extends keyword.

Let's dive deeper into inheritance in classes in TypeScript:

Creating a Base Class (Superclass):

A base class, also known as a superclass, serves as the blueprint for creating derived classes. It defines the common properties and methods that derived classes can inherit.

javascriptclass Animal {
  name: string;

  constructor(name: string) {
    this.name = name;
  }

  makeSound() {
    console.log(`${this.name} makes a sound.`);
  }
}

const cat = new Animal('Tom');
console.log(cat.makeSound()); // Tom makes a sound.
const mouse = new Animal('Jerry');
console.log(mouse.makeSound()); // Jerry makes a sound.

Creating Derived Classes (Subclasses):

Derived classes, or subclasses, inherit the properties and methods from the base class using the extends keyword. They can also define additional properties and methods.

Extending a Base Class:

javascriptclass Dog extends Animal {
  breed: string;

  constructor(name: string, breed: string) {
    super(name); // Call the base class constructor
    this.breed = breed;
  }

  bark() {
    console.log(`${this.name} (a ${this.breed} dog) barks.`);
  }
}

const dog = new Animal('Tiger', 'German Shepherd');
console.log(dog.bark()); // Tiger a German Shepherd barks.

Accessing Superclass Members:

In derived classes, you can access superclass members (properties and methods) using the super keyword.

javascriptclass Cat extends Animal {
  constructor(name: string) {
    super(name);
  }

  makeSound() {
    super.makeSound(); // Call the superclass method
    console.log(`${this.name} (a cat) purrs.`);
  }
}

Method Overriding:

Derived classes can override methods from the base class. This allows you to provide a new implementation of a method in the subclass.

javascriptclass Horse extends Animal {
  constructor(name: string) {
    super(name);
  }

  makeSound() {
    console.log(`${this.name} (a horse) neighs.`);
  }
}

Inheritance Chain:

You can create a hierarchy of classes by having multiple levels of inheritance. Each derived class can have its own subclasses, forming a chain of inheritance.

javascriptclass WildAnimal extends Animal {
  constructor(name: string) {
    super(name);
  }

  roam() {
    console.log(`${this.name} (a wild animal) roams freely.`);
  }
}

class Lion extends WildAnimal {
  constructor(name: string) {
    super(name);
  }

  makeSound() {
    console.log(`${this.name} (a lion) roars loudly.`);
  }
}

Access Modifiers in Inheritance:

Access modifiers (public, private, protected) also apply to inherited members. In TypeScript, a subclass can access public and protected members from its superclass, but not private members.

Key Points:

  • Inheritance allows you to create a hierarchy of classes, with derived classes inheriting properties and behaviors from base classes.

  • Base classes define common functionality, and derived classes can add or modify it as needed.

  • Method overriding allows you to provide custom implementations of methods in subclasses.

  • TypeScript enforces type safety and access control for inherited members.

Inheritance is a powerful tool for building complex class hierarchies and promoting code reuse. It facilitates creating well-structured and maintainable code by organizing classes into a meaningful hierarchy while leveraging the advantages of object-oriented programming.

1280 x 720 px