Utilizing Classes in TypeScript

TypeScript Fundamental Series

1. Understanding Types in TypeScript
2. Mastering Functions in TypeScript
3. Exploring Interfaces in TypeScript
4. Utilizing Classes in TypeScript
5. Leveraging Generics in TypeScript
6. Advanced Type Features in TypeScript

Welcome to the fourth post in our series on the fundamentals of TypeScript. In this article, we'll explore the world of classes and how they can be used to create reusable, object-oriented code in TypeScript.

Classes are a fundamental part of object-oriented programming (OOP), and TypeScript provides a rich set of features to work with them effectively. Let's dive in!

Defining Classes In TypeScript, you can define classes using the class keyword. Classes can have properties, methods, and a constructor, which is used to initialize the object's state.

Here's an example of a simple Student class:

class Student {
  name: string;
  age: number;

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

  introduce(): void {
    console.log(`Hi, my name is ${this.name} and I'm ${this.age} years old.`);
  }
}

let student = new Student('Alice', 20);
student.introduce(); // Hi, my name is Alice and I'm 20 years old.

In this example, the Student class has two properties (name and age) and a method (introduce()). The constructor is used to initialize the object's properties when a new Student instance is created.

Access Modifiers TypeScript provides access modifiers that allow you to control the visibility of class members (properties and methods). The available access modifiers are:

1. public: The member can be accessed from anywhere.
2. private: The member can only be accessed within the class.
3. protected: The member can be accessed within the class and its subclasses.

Here's an example of using access modifiers in a class:

class BankAccount {
  public balance: number;
  private transactionHistory: number[];

  constructor(initialBalance: number) {
    this.balance = initialBalance;
    this.transactionHistory = [];
  }

  deposit(amount: number): void {
    this.balance += amount;
    this.transactionHistory.push(amount);
  }

  private getTransactionHistory(): number[] {
    return this.transactionHistory;
  }
}

let account = new BankAccount(1000);
account.deposit(500); // This is allowed
// account.transactionHistory; // Error: Property 'transactionHistory' is private and only accessible within class 'BankAccount'.

In this example, the balance property is public, so it can be accessed from outside the class. The transactionHistory property is private, so it can only be accessed within the BankAccount class. The getTransactionHistory() method is also private.

Inheritance and Polymorphism TypeScript supports inheritance, which allows you to create new classes based on existing ones. This is known as the "is-a" relationship, where a subclass is a more specific type of the superclass.

class Person {
  name: string;
  age: number;

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

  introduce(): void {
    console.log(`Hi, my name is ${this.name} and I'm ${this.age} years old.`);
  }
}

class Student extends Person {
  grade: number;

  constructor(name: string, age: number, grade: number) {
    super(name, age);
    this.grade = grade;
  }

  introduce(): void {
    super.introduce();
    console.log(`I'm in grade ${this.grade}.`);
  }
}

let student = new Student('Alice', 12, 7);
student.introduce(); // Hi, my name is Alice and I'm 12 years old. I'm in grade 7.

In this example, the Student class extends the Person class, inheriting the name and age properties, as well as the introduce() method. The Student class also adds a grade property and overrides the introduce() method to include the student's grade.

This is an example of polymorphism, where the introduce() method behaves differently for Person and Student objects, even though they share the same method name.

Abstract Classes TypeScript also supports abstract classes, which are used as a blueprint for other classes. Abstract classes can have abstract methods, which must be implemented by the concrete subclasses.

abstract class Animal {
  name: string;

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

  abstract makeSound(): void;

  move(): void {
    console.log(`${this.name} is moving.`);
  }
}

class Dog extends Animal {
  makeSound(): void {
    console.log('Woof!');
  }
}

let dog = new Dog('Buddy');
dog.makeSound(); // Woof!
dog.move(); // Buddy is moving.

In this example, the Animal class is an abstract class with an abstract makeSound() method. The Dog class extends Animal and provides the implementation for the makeSound() method.

Static Methods and Properties TypeScript also supports static methods and properties, which are associated with the class itself, rather than individual instances of the class.

class Math {
  static PI: number = 3.14159;

  static add(a: number, b: number): number {
    return a + b;
  }
}

console.log(Math.PI); // 3.14159
let result = Math.add(2, 3); // 5

In this example, the PI property and the add() method are static, so they can be accessed directly on the Math class, without needing to create an instance of the class.

By mastering the use of classes in TypeScript, you can create more organized, reusable, and maintainable code.