Mastering TypeScript Classes and Inheritance

In the previous articles, we explored TypeScript types and interfaces. In this article, we will dive into TypeScript classes and inheritance. Classes are a cornerstone of object-oriented programming, and TypeScript brings full support for classes, along with powerful features like inheritance, access modifiers, and more.

Defining Classes

In TypeScript, you can define classes using the class keyword. Classes can have properties, constructors, and methods. Here's an example of defining a class:

class Person {
  firstName: string;
  lastName: string;
  age: number;

  constructor(firstName: string, lastName: string, age: number) {
    this.firstName = firstName;
    this.lastName = lastName;
    this.age = age;
  }

  getFullName(): string {
    return `${this.firstName} ${this.lastName}`;
  }
}

const john = new Person("John", "Doe", 30);
console.log(john.getFullName()); // Output: 'John Doe'

Inheritance

TypeScript supports inheritance, allowing you to create subclasses that inherit properties and methods from their parent classes. Inheritance is achieved using the extends keyword. You can also use the super keyword to call the constructor and methods of the parent class.

Here's an example of using inheritance:

class Employee extends Person {
  employeeId: number;

  constructor(firstName: string, lastName: string, age: number, employeeId: number) {
    super(firstName, lastName, age);
    this.employeeId = employeeId;
  }

  getEmployeeInfo(): string {
    return `${this.getFullName()} (ID: ${this.employeeId})`;
  }
}

const jane = new Employee("Jane", "Doe", 28, 1);
console.log(jane.getEmployeeInfo()); // Output: 'Jane Doe (ID: 1)'

Access Modifiers

TypeScript supports access modifiers, which control the visibility of class members. The three access modifiers are:

public - Members are accessible from anywhere (default access level).
private - Members are only accessible within the class.
protected - Members are accessible within the class and its subclasses.

Here's an example of using access modifiers:

class Vehicle {
  public make: string;
  private speed: number;
  protected year: number;

  constructor(make: string, year: number) {
    this.make = make;
    this.year = year;
    this.speed = 0;
  }

  public accelerate(): void {
    this.speed += 10;
  }

  public getSpeed(): number {
    return this.speed;
  }
}

class Car extends Vehicle {
  constructor(make: string, year: number) {
    super(make, year);
  }

  public getYear(): number {
    return this.year;
  }
}

const car = new Car("Toyota", 2020);
car.accelerate();
console.log(car.getSpeed()); // Output: 10
console.log(car.getYear()); // Output: 2020

Conclusion

In this article, we covered TypeScript classes and inheritance, including defining classes, constructors, methods, inheritance, and access modifiers. With this knowledge, you can now create powerful and organized object-oriented TypeScript code. In the next article, we will explore TypeScript generics for flexible and type-safe code.

Programming 101