Модифікатори доступу в TypeScript: public, private, protected, readonly

Що таке модифікатори доступу?

Модифікатори доступу контролюють видимість властивостей та методів класу. TypeScript додає модифікатори public, private, protected та readonly до синтаксису класів JavaScript.

public (за замовчуванням)

Доступний з будь-якого місця — це значення за замовчуванням:

typescript

class User {
  public name: string;  // Доступний скрізь

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

  public greet(): string {
    return `Hello, ${this.name}`;
  }
}

const user = new User("Alice");
user.name;    // ✅ Доступно
user.greet(); // ✅ Доступно

private

Доступний лише всередині класу:

typescript

class BankAccount {
  private balance: number;

  constructor(initial: number) {
    this.balance = initial;
  }

  public deposit(amount: number): void {
    this.balance += amount; // ✅ Доступ всередині класу
  }

  public getBalance(): number {
    return this.balance; // ✅ Доступ всередині класу
  }
}

const account = new BankAccount(1000);
account.deposit(500);      // ✅
account.getBalance();      // ✅
account.balance;           // ❌ Помилка: Властивість 'balance' є приватною

TypeScript private vs JavaScript #private

typescript

class Example {
  private tsPrv = 1;  // Лише для TypeScript (на етапі компіляції)
  #jsPrv = 2;         // Приватне поле JavaScript (під час виконання, ES2022)
}

// Приватне поле TypeScript: все ще доступне під час виконання (немає обмежень)
// JS # приватне: дійсно приватне під час виконання

protected

Доступний всередині класу та його підкласів:

typescript

class Animal {
  protected name: string;

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

  protected makeSound(): string {
    return "...";
  }
}

class Dog extends Animal {
  public bark(): string {
    return `${this.name} says: Woof!`; // ✅ Доступ у підкласі
  }

  public sound(): string {
    return this.makeSound(); // ✅ Приватний метод доступний у підкласі
  }
}

const dog = new Dog("Rex");
dog.bark();  // ✅ "Rex says: Woof!"
dog.name;    // ❌ Помилка: Властивість 'name' є захищеною

readonly

Може бути встановлено лише в конструкторі або під час оголошення — ніколи не змінюється після:

typescript

class Config {
  readonly apiUrl: string;
  readonly maxRetries: number = 3; // Значення за замовчуванням

  constructor(url: string) {
    this.apiUrl = url; // ✅ Встановлено в конструкторі
  }

  updateUrl() {
    this.apiUrl = "new-url"; // ❌ Помилка: Не можна присвоїти 'apiUrl'
  }
}

Властивості параметрів (скорочений запис)

typescript

// ❌ Багато слів
class User {
  private name: string;
  private age: number;

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

// ✅ Скорочений запис з властивостями параметрів
class User {
  constructor(
    private name: string,
    private age: number,
    public readonly id: string
  ) {}
  // Властивості автоматично оголошуються та присвоюються!
}

Модифікатор	У класі	У підкласі	Ззовні
`public`	✅	✅	✅
`protected`	✅	✅	❌
`private`	✅	❌	❌
`readonly`	Встановлено один раз	Тільки для читання	Тільки для читання

Використовуйте private для внутрішніх деталей реалізації, protected для точок розширення в ієрархіях класів, а readonly для незмінних властивостей. Віддавайте перевагу властивостям параметрів (скорочений запис), щоб зменшити обсяг коду. Для дійсної приватності під час виконання використовуйте приватні поля JavaScript #.

Коротка відповідь

Для співбесіди

Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.

Дочитали статтю?

Практика завдань