menu

JavaScript/Typescript - 16 Topics

DEEP DIVE INTO

JavaScript/Typescript

Topic:What is class in typescript

menu

In TypeScript, classes provide a way to define blueprints for creating objects with a predefined structure and behavior. They offer a more structured and familiar approach to object-oriented programming.

Let's dive deeper into classes in TypeScript:

Class Definition:

A class in TypeScript is defined using the class keyword followed by the class name. It can contain properties, methods, constructors, and access modifiers.

Example:

javascriptclass Person {
  private name: string;
  public age: number;

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

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

Class Members:

  • Properties: These are variables that belong to the class and define its state. They can have access modifiers like public, private, and protected.

  • Constructors: These special methods are called when creating instances of the class and allow initialization of properties.

  • Methods: These are functions within a class that define the behavior or actions of instances created from the class.

Properties:

Properties are variables that are associated with a class and define the state of the class instances. They can have different access modifiers.

Instance Properties:

javascriptclass Person {
  name: string; // Public by default
  private age: number;
  protected email: string;

  constructor(name: string, age: number, email: string) {
    this.name = name;
    this.age = age;
    this.email = email;
  }
}
  • Public (default): Can be accessed from within the class, derived classes, and instances.

  • Private: Accessible only within the class itself.

  • Protected: Accessible within the class and any subclasses that extend it.

Static Properties:

Static properties belong to the class itself rather than to instances. They are accessed using the class name.

javascriptclass MathOperations {
  static PI: number = 3.14;
  static readonly gravity: number = 9.81;
}

Methods:

Methods are functions defined within a class that describe the behavior or actions of the class instances.

javascriptclass Calculator {
  add(a: number, b: number): number { // add is an instance method
    return a + b;
  }

  static multiply(a: number, b: number): number { // multiply is a static method
    return a * b;
  }
}
  • Instance Methods: Associated with instances of the class and can access instance properties.

  • Static Methods: Belong to the class itself and cannot access instance properties. They are called using the class name.

Access Modifiers:

TypeScript provides access modifiers to control the visibility and access level of class members:

  • Public (default): No explicit keyword is needed. Members are accessible from outside the class.

  • Private: Members are only accessible within the class where they are defined.

  • Protected: Members are accessible within the class and its subclasses.

Readonly Properties:

Properties can be marked as readonly, meaning their values can be set only during initialization or within the constructor.

javascriptclass Circle {
  readonly PI: number = 3.14;
  constructor(readonly radius: number) {}
}

Getters and Setters:

TypeScript supports getter and setter methods to encapsulate property access.

javascriptclass User {
  private _age: number = 0;

  get age(): number {
    return this._age;
  }

  set age(value: number) {
    if (value >= 0) {
      this._age = value;
    }
  }
}

These members collectively define the structure, state, and behavior of class instances in TypeScript. They offer a way to encapsulate data and functionality, ensuring better code organization and maintainability within an object-oriented paradigm. The use of access modifiers ensures encapsulation and information hiding, promoting better class design and preventing accidental misuse or modification of class members.

1280 x 720 px