Define and Use Classes in TypeScript

TypeScript enhances JavaScript by adding static types, making it possible to define classes more explicitly. This guide will show you how to define and use classes in TypeScript with various examples.

Basic Class Definition

Classes in TypeScript are blueprints for creating objects. They encapsulate data and functions that operate on that data. Here’s how you can define a basic class in TypeScript:


class Person {
  name: string;
  age: number;

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

  greet(): string {
    return `Hello, my name is ${this.name} and I am ${this.age} years old.`;
  }
}

const person1 = new Person("Alice", 30);
console.log(person1.greet()); // Output: Hello, my name is Alice and I am 30 years old.

Class Members

Class members include properties and methods. Properties define the data, while methods define the behavior. You can access these members using the this keyword:


class Car {
  brand: string;
  model: string;

  constructor(brand: string, model: string) {
    this.brand = brand;
    this.model = model;
  }

  getDetails(): string {
    return `Car: ${this.brand} ${this.model}`;
  }
}

const car1 = new Car("Toyota", "Corolla");
console.log(car1.getDetails()); // Output: Car: Toyota Corolla

Inheritance

TypeScript supports inheritance, allowing you to create new classes based on existing ones using the extends keyword:


class Animal {
  name: string;

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

  move(distance: number): void {
    console.log(`${this.name} moved ${distance} meters.`);
  }
}

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

const dog = new Dog("Buddy");
dog.bark(); // Output: Woof! Woof!
dog.move(10); // Output: Buddy moved 10 meters.

Access Modifiers

Access modifiers control the visibility of class members. TypeScript provides public, private, and protected access modifiers:


class Employee {
  public name: string;
  private salary: number;
  protected position: string;

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

  public getDetails(): string {
    return `Employee: ${this.name}, Position: ${this.position}`;
  }
}

const employee1 = new Employee("John", 50000, "Manager");
console.log(employee1.getDetails()); // Output: Employee: John, Position: Manager

Implementing Interfaces

A class can implement an interface to ensure it adheres to a specific structure. Here’s an example:


interface IPerson {
  name: string;
  age: number;
  greet(): string;
}

class Person implements IPerson {
  name: string;
  age: number;

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

  greet(): string {
    return `Hello, my name is ${this.name} and I am ${this.age} years old.`;
  }
}

const person2 = new Person("Bob", 25);
console.log(person2.greet()); // Output: Hello, my name is Bob and I am 25 years old.

Conclusion

Defining and using classes in TypeScript provides a structured and robust way to manage data and behavior in your applications. By leveraging class members, inheritance, access modifiers, and interfaces, you can create well-organized and maintainable code.

Archive