Inheritance in TypeScript – A Detailed Guide

Inheritance is one of the core concepts of object-oriented programming. It allows a class to inherit properties and methods of another class, thus forming a hierarchy of parent and child classes. TypeScript is an object-oriented language that supports inheritance. TypeScript provides various ways to implement inheritance in your code. In this article, we’ll delve deeper into inheritance in TypeScript, its advantages, and usage.

Advantages of Inheritance

Using inheritance in your code has several advantages, including:

  • Reusable code: By inheriting the properties and methods of a parent class, you can create new classes with less effort.

  • Code organization: Inheritance helps you to organize your code into a hierarchy, making it more manageable.

  • Code maintenance: When you need to change a behavior or implement new features, you need to update only the parent class, and the changes will automatically reflect in all the child classes.

  • Polymorphism: Inheritance helps in achieving polymorphism, which allows you to write more general code and reuse it across multiple classes.

Inheritance in TypeScript

TypeScript provides various ways to implement inheritance. We’ll discuss each type of inheritance in TypeScript.

Single Inheritance

Single inheritance is the most common type of inheritance in object-oriented programming. In single inheritance, a child class can inherit properties and methods from only one parent class. In TypeScript, you can use the extends keyword to implement single inheritance.

“`
class Employee {
empName: string;
constructor(name: string) {
this.empName = name;
}
displayEmpName() {
console.log(`Employee name: ${this.empName}`);
}
}
class Manager extends Employee {
department: string;
constructor(name: string, dept: string) {
super(name);
this.department = dept;
}
displayDept() {
console.log(`Employee department: ${this.department}`);
}
}
let manager = new Manager(“John”, “Sales”);
manager.displayEmpName();
manager.displayDept();
“`

In the above example, the Manager class inherits properties and methods from the Employee class using the extends keyword. The Manager class has its constructor, which also calls the parent constructor using the super keyword. The above code will output:

“`
Employee name: John
Employee department: Sales
“`

Multi-Level Inheritance

Multi-level inheritance is a type of inheritance where a child class can inherit properties and methods from one parent class and become the parent class for another child class. TypeScript supports multi-level inheritance. Here’s an example:

“`
class Animal {
move() {
console.log(“Animal is moving”);
}
}
class Fish extends Animal {
swim() {
console.log(“Fish is swimming”);
}
}
class GoldFish extends Fish {
eat() {
console.log(“GoldFish is eating”);
}
}
let goldFish = new GoldFish();
goldFish.move();
goldFish.swim();
goldFish.eat();
“`

In the above example, the Animal class has a method called move that the Fish class inherits. The Fish class has a swim method that the GoldFish class inherits. The GoldFish class has its eat method. The above code will output:

“`
Animal is moving
Fish is swimming
GoldFish is eating
“`

Multiple Inheritance

Multiple inheritance is a type of inheritance where a child class can inherit properties and methods from more than one parent class. TypeScript does not support multiple inheritance directly. However, you can achieve multiple inheritance in TypeScript by using mixins. A Mixin is a class that contains the properties and methods that you want to add to another class. Here’s an example:

“`
class JumpingAbility {
jump() {
console.log(“Can jump”);
}
}
class SwimmingAbility {
swim() {
console.log(“Can swim”);
}
}
class Penguin implements JumpingAbility, SwimmingAbility {
jump: () => void;
swim: () => void;
constructor() {
let jumping = new JumpingAbility();
let swimming = new SwimmingAbility();
this.jump = jumping.jump.bind(this);
this.swim = swimming.swim.bind(this);
}
}
let penguin = new Penguin();
penguin.jump();
penguin.swim();
“`

In this example, the JumpingAbility and SwimmingAbility classes are mixins. The Penguin class implements both the JumpingAbility and SwimmingAbility, which is equivalent to inheriting from two classes. However, to use a mixin, you need to create instances of the mixin classes and bind their methods to the child class methods. The above code will output:

“`
Can jump
Can swim
“`

Method Overriding

Method overriding is a concept in inheritance where the child class provides its implementation for the inherited methods. TypeScript supports method overriding. Here’s an example:

“`
class Shape {
draw() {
console.log(“Draw a shape”);
}
}
class Circle extends Shape {
draw() {
console.log(“Draw a circle”);
}
}
let circle = new Circle();
circle.draw();
“`

In this example, the Circle class overrides the draw method of the Shape class. The child class provides its implementation, and the output will be:

“`
Draw a circle
“`

FAQs

What is inheritance in TypeScript?

Inheritance is a concept in TypeScript, which allows a child class to inherit properties and methods from a parent class.

What are the types of inheritance supported by TypeScript?

TypeScript supports single, multi-level, and multiple inheritance via mixins.

What are the advantages of inheritance?

Inheritance helps you to write reusable, organized, and more manageable code. You can also achieve polymorphism using inheritance.

What is method overriding?

Method overriding is a concept in inheritance, where the child class provides its implementation for inherited methods.

What is a mixin?

A Mixin is a class that contains properties and methods that you want to add to another class.

Similar Posts