Classes and TypeScript

Access modifier keywords

TypeScript provides three access modifier keywords which can be used with class fields and methods to describe who should be able to see and use them.

A few things to note:

• A class can expose private functionality to a subclass by including it in protected functionality
• A class and subclass can expose private and protected functionality by including it in public functionality.
• Can think of this almost like getters and setters where a particular field or method may not be directly accessible, but its value is made accessible through another bit of functionality.

NOTE: access modifier keywords do NOT provide any real privacy or security benefits at runtime. These are purely development and compile time tools.

These are about encapsulation, not security.

readonly

Can be used with access modifier keywords.

Think of it like const in that it prevents reassignment, but not mutability.

However remember that primitives are immutable, so trying to update the value of a number (for instance) is not allowed.

class Car {
  public make: string;
  public model: string;
  public readonly year: number;

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

  updateYear() {
    this.year++; // <- ERROR
    // Error: Cannot assign to 'year' because it is a read-only property.
  }
}

Param Properties

TypeScript provides a more concise syntax when defining classes through the use of param properties

BEFORE:

class Car {
  make: string;
  model: string;
  year: number;
  constructor(make: string, model: string, year: number) {
    this.make = make;
    this.model = model;
    this.year = year;
  }
}

AFTER:

class Car {
  constructor(public make: string, public model: string, public year: number) {}
}

They compile exactly the same.

From the TypeScript Fundamentals, v3↗ course on FEM↗ taught by Mike North↗.