implements, abstract и приватность на уровне типов

Здесь будет встроен видео-разбор темы (5–7 минут, YouTube / RuTube / VK Видео) — тем, кто лучше воспринимает на слух, текст ниже не обязателен.

Раз тип — это форма, а не имя, класс подходит под интерфейс сам собой, ни у кого не спрашиваясь. Значит, implements никуда не пускает и ничего не открывает. Он делает другое: переносит ошибку туда, где её проще чинить. Посмотрите, где компилятор ругается на класс с опечаткой в имени метода.

ts

interface Clickable {
  onClick(): void;
}
class Button {
  onclick(): void {
    console.log("клик");
  }
}
function bind(target: Clickable): void {
  target.onClick();
}
bind(new Button());

страница примера

Сначала предположите, что выведет код

Диагностика прилетает в последнюю строку: Аргумент типа "Button" нельзя назначить параметру типа "Clickable", причина — Свойство "onClick" отсутствует в типе "Button". Класс объявлен выше и выглядит невинно, а виновата в нём одна буква. В большом файле такой поиск занимает минуты; в чужом коде — больше.

Теперь допишем одно слово в объявление класса — и ничего больше.

ts

interface Clickable {
  onClick(): void;
}
class Button implements Clickable {
  onclick(): void {
    console.log("клик");
  }
}
function bind(target: Clickable): void {
  target.onClick();
}
bind(new Button());

страница примера

Сначала предположите, что выведет код

Диагностик стало две. Прежняя осталась — форма-то не изменилась. Но добавилась новая, ровно на строке с class: Класс "Button" неправильно реализует интерфейс "Clickable", и та же вложенная причина про пропавший onClick. Это и есть весь смысл implements: примерка контракта прямо в месте объявления.

implements не меняет тип класса и не даёт ему поблажек. Уберите его — совместимость останется прежней, исчезнет только ранняя проверка.

А вот чего implements не делает — так это не раздаёт типы. Слово стоит рядом, интерфейс объявлен выше, параметр метода назван так же, и всё равно:

ts

interface Logger {
  prefix: string;
  write(message: string): void;
}
class ConsoleLogger implements Logger {
  prefix = "[log]";
  write(message) {
    console.log(this.prefix + " " + message);
  }
}
new ConsoleLogger().write("готово");

страница примера

Сначала предположите, что выведет код

Параметр "message" неявно имеет тип "any" — знакомая TS7006 из главы про базовые типы. Контекстная типизация, которая выручает в колбэках, на методы класса не распространяется: тело класса компилятор читает само по себе, а потом сверяет получившееся с интерфейсом. Сверка идёт в одну сторону — от класса к контракту, не обратно. Типы параметров придётся выписать руками.

Метод на месте, имя правильное, а тип возврата не тот — тогда номер другой и причина вложена глубже.

ts

interface Vehicle {
  wheels: number;
  drive(distance: number): string;
}
class Bike implements Vehicle {
  wheels = 2;
  drive(distance: number): number {
    return distance;
  }
}
console.log(new Bike().drive(10));

страница примера

Сначала предположите, что выведет код

TS2416: Свойство "drive" в типе "Bike" невозможно присвоить тому же свойству в базовом типе "Vehicle" → Тип "(distance: number) => number" не может быть назначен для типа "(distance: number) => string" → Тип "number" не может быть назначен для типа "string". Три уровня, и последний — тот самый, который надо чинить. Читается так же, как в статье про вложенные причины: сверху вниз, до самой конкретной строки.

Интерфейс умеет только требовать. Абстрактный класс требует и одновременно даёт готовый код: часть методов написана, часть помечена abstract и оставлена наследнику. Классический приём — общий алгоритм в базе, а разница вынесена в дыры.

ts

abstract class Shape {
  abstract name: string;
  abstract area(): number;
  // общий метод опирается на то, чего в этом классе ещё нет
  describe(): string {
    return this.name + ": " + this.area().toFixed(1);
  }
}
class Circle extends Shape {
  name = "круг";
  radius = 2;
  area(): number {
    return Math.PI * this.radius ** 2;
  }
}
class Rect extends Shape {
  name = "прямоугольник";
  width = 2;
  height = 3;
  area(): number {
    return this.width * this.height;
  }
}
const shapes: Shape[] = [new Circle(), new Rect()];
for (const shape of shapes) console.log(shape.describe());

страница примера

Сначала предположите, что выведет код

Ни одной диагностики. describe вызывает this.area(), которого в Shape нет, — и это законно: abstract обещает, что у любого настоящего экземпляра метод будет. Обещание держится ровно одним запретом.

ts

abstract class Shape {
  abstract area(): number;
  describe(): string {
    return "площадь " + this.area().toFixed(2);
  }
}
const ghost = new Shape();
console.log(ghost.describe());

страница примера

Сначала предположите, что выведет код

TS2511: Невозможно создать экземпляр абстрактного класса. А дальше — то, ради чего этот пример и написан: код всё равно выполняется и падает по-настоящему. TypeError: this.area is not a function.

Причина в том, что abstract — чистая выдумка TypeScript. В браузер уезжает обыкновенный class Shape без единого следа абстрактности, и new для него — законная операция. Запрет существует только на этапе проверки; проигнорировали диагностику — получили объект с дырой вместо метода.

Абстрактный класс годится как тип: массив Shape[] выше собран без единой жалобы. Нельзя вызвать new — всё остальное можно.

Если наследник забудет закрыть дыру, компилятор скажет об этом на объявлении наследника, а не при первом вызове. Точные слова — в задаче в конце статьи, а пока сравним два инструмента.

	`interface`	абстрактный класс
Готовый код внутри	нет, только требования	да, обычные методы и поля
Сколько можно взять	сколько угодно: `implements A, B`	один: `extends`
Доживает до браузера	нет, стирается целиком	да, это обычный класс
Создать экземпляр	нечего создавать	нельзя — TS2511
Контракт не выполнен	TS2420 на строке класса	TS2515 на строке класса

extends и implements не конфликтуют: класс наследует реализацию у одного родителя и параллельно расписывается под сколькими угодно контрактами. Порядок слов фиксированный — сначала extends.

ts

type Named = { name: string };
interface Aged {
  age: number;
}
abstract class Being {
  abstract name: string;
  hello(): string {
    return "я " + this.name;
  }
}
class Person extends Being implements Named, Aged {
  name = "Рико";
  age = 39;
}
const p = new Person();
console.log(p.hello(), p.age);

страница примера

Сначала предположите, что выведет код

И заодно видно, что implements берёт не только интерфейсы: слева от запятой стоит псевдоним типа Named. Компилятору всё равно, как назван объектный тип.

В JavaScript у поля есть ровно два состояния: обычное и #приватное. TypeScript добавляет к этому три слова, которые расставляют доступ мягче: public (по умолчанию, писать не обязательно), protected — «я и наследники», private — «только я».

ts

class Account {
  private balance = 100;
  protected owner = "Рико";
  bank = "Точка";
  add(sum: number): void {
    this.balance += sum;
  }
  show(): string {
    return this.owner + ": " + this.balance;
  }
}
class Savings extends Account {
  who(): string {
    return this.owner;
  }
}
const acc = new Account();
acc.add(50);
console.log(acc.show());
console.log(acc.balance);
console.log(acc.owner);
console.log(acc.bank);

страница примера

Сначала предположите, что выведет код

Две диагностики, каждая называет виновника поимённо: Свойство "balance" является закрытым и доступно только в классе "Account" и Свойство "owner" является защищенным и доступно только в классе "Account" и его подклассах. И — привычное уже — обе строки всё равно печатают значения. Запрет живёт до сборки, данные живут дольше.

Насколько «дольше», лучше видно на голом примере. Предскажите три строки вывода, прежде чем нажимать Run.

ts

class Account {
  private balance = 100;
}
const acc = new Account();
console.log(JSON.stringify(acc));
console.log(Object.keys(acc));
console.log(acc["balance"]);

страница примера

Сначала предположите, что выведет код

Ни одной диагностики — и это не опечатка в статье. Первые две строки понятны: private стирается при компиляции, в браузер уезжает обычное поле, и любой перебор его находит. Третья строка удивительнее: обращение через квадратные скобки компилятор пропускает молча. Доступ по строковому ключу компилятор на закрытость не проверяет — известная лазейка, которой пользуются в тестах, когда нужно заглянуть внутрь чужого класса.

private — это договор между вами и компилятором, а не защита данных. Никакой приватности в собранном коде от него не остаётся.

Если контракт требует свойство, класс обязан отдать его публично. Спрятать поле и одновременно им отчитаться не выйдет.

ts

interface Vehicle {
  wheels: number;
}
class Bus implements Vehicle {
  private wheels = 6;
  count(): number {
    return this.wheels;
  }
}
console.log(new Bus().count());

страница примера

Сначала предположите, что выведет код

TS2420: Класс "Bus" неправильно реализует интерфейс "Vehicle" → Свойство "wheels" является закрытым в типе "Bus" и не является таковым в типе "Vehicle". Уровень доступа — часть формы, а не украшение поверх неё.

Здесь начинается самое неожиданное. Правило «совпал состав — совпал тип» вы знаете из главы про структурную типизацию: два класса с полями x и y взаимозаменяемы, даже если ничего друг о друге не знают. Добавьте в оба по одному private — и правило перестаёт работать.

ts

class Meters {
  private value = 0;
}
class Seconds {
  private value = 0;
}
let m: Meters = new Meters();
const t: Seconds = new Seconds();
m = t;
console.log("присвоение состоялось");

страница примера

Сначала предположите, что выведет код

Тип "Seconds" не может быть назначен для типа "Meters" → Типы имеют раздельные объявления закрытого свойства "value". Ключевое слово — раздельные. Компилятор сравнивает не имена и не типы полей, а место, где поле объявлено: два разных private value — это два разных поля, сколько бы они ни были похожи.

Проверить эту формулировку легко: если объявление одно на двоих, совместимость возвращается.

ts

class Base {
  private id = 1;
}
class Child extends Base {}
class Twin {
  private id = 1;
}
const asBase: Base = new Child();
console.log("наследник подошёл");
const asTwin: Twin = new Base();
console.log("близнец тоже?");

страница примера

Сначала предположите, что выведет код

Первое присваивание проходит, второе — нет. Такое поведение называют номинальной типизацией: тип определяется происхождением, а не формой. В TypeScript её нет как отдельной возможности, но одно закрытое поле включает её для конкретного класса.

Отсюда приём «брендирования»: закрытое поле-пустышка не даёт перепутать Метры с Секундами, хотя внутри у обоих одно число.

Если в примере убрать оба слова private, обе диагностики исчезнут — классы снова станут просто «объектами без полей», а такие подходят куда угодно. Попробуйте, это одно слово.

Про #поле вы читали в главе про классы: это часть самого JavaScript, и живёт оно до конца — в собранном коде, в браузере, во время выполнения. Разница между ним и private видна в четырёх строках.

ts

class TsAccount {
  private balance = 100;
}
class HashAccount {
  #balance = 100;
  value(): number {
    return this.#balance;
  }
}
console.log(JSON.stringify(new TsAccount()));
console.log(JSON.stringify(new HashAccount()));
console.log(new TsAccount()["balance"]);
console.log(new HashAccount().value());

страница примера

Сначала предположите, что выведет код

Компилятор молчит на всех четырёх строках, а результаты противоположные. Поле под private сериализуется, перебирается и достаётся скобками. Поле с решёткой не видно ни в JSON.stringify, ни в Object.keys — и достать его снаружи нельзя вообще никак.

«Никак» — это буквально. Обращение к чужому #полю ловится дважды.

ts

class Wallet {
  #balance = 100;
}
const w = new Wallet();
console.log(w.#balance);

страница примера

Сначала предположите, что выведет код

Сначала компилятор: TS18013: Свойство "#balance" недоступно вне класса "Wallet", так как оно имеет закрытый идентификатор. Потом — сам движок: SyntaxError: Private field '#balance' must be declared in an enclosing class. Не undefined, не TypeError при вызове, а отказ разобрать код: строка не запускается вообще, вместе со всем файлом. Из всех примеров этой статьи только здесь ошибка типов совпала с ошибкой языка.

	`private` из TypeScript	`#поле` из JavaScript
Кто проверяет	только компилятор	компилятор и движок
Что в собранном коде	обычное поле	настоящее приватное поле
`JSON.stringify`, `Object.keys`	показывают	не видят
Обход через `obj["имя"]`	работает, диагностики нет	невозможен
Доступ из наследника	нет (для этого `protected`)	нет, и обойти нельзя
Годится для секрета	нет	да

Выбор из этого выходит несложный. Нужно спрятать реализацию от коллеги и получить подсказку в редакторе — хватит private: он короче, работает с protected и понятен по всей иерархии. Нужно, чтобы значение действительно нельзя было прочитать снаружи — токен, ключ, внутренний кеш, — только решётка.

Эффект из прошлого раздела у #поля ровно такой же, только формулировка причины другая.

ts

class Meters {
  #value = 0;
}
class Seconds {
  #value = 0;
}
const t: Meters = new Seconds();
console.log("присвоение состоялось");

страница примера

Сначала предположите, что выведет код

Свойство "#value" в типе "Seconds" ссылается на другой член, к которому невозможно обратиться из типа "Meters". Здесь это уже не выдумка компилятора: два #value — действительно разные поля и во время выполнения.

implements не даёт классу никаких прав: он лишь примеряет контракт в месте объявления, чтобы ошибка не всплыла у вызова.
Типы через implements не наследуются — параметр метода без аннотации остаётся неявным any и ловит TS7006.
Абстрактный класс совмещает требование и готовый код; new для него запрещён (TS2511), но при сборке слово стирается — и в песочнице объект всё-таки создаётся.
private и protected — договорённость с компилятором: в собранном коде это обычные поля, видимые в JSON.stringify и достижимые через obj["имя"].
Закрытое поле включает номинальную типизацию: два одинаковых по форме класса перестают быть взаимозаменяемыми (TS2322, «раздельные объявления»).
Настоящую приватность даёт только #поле из части I: его не видно снаружи ни компилятору, ни движку.

1/4Класс объявлен как class ConsoleLogger implements Logger, у интерфейса метод write(message: string): void, а в классе написано write(message) { ... } — без типа параметра. Что скажет компилятор?

2/4В песочнице учебника выполняется const ghost = new Shape(), где Shape — абстрактный класс с abstract area(), а затем вызывается метод, который внутри дёргает this.area(). Что увидит читатель?

3/4Два класса объявлены одинаково: у каждого единственное поле private value = 0. Присваиваем экземпляр одного в переменную типа другого. Что произойдёт?

4/4У одного объекта поле объявлено как private token = "...", у другого — как #token = "...". Оба прогоняем через JSON.stringify. Что получится?

Контракт не сошёлся

Класс подписался под интерфейс, но до контракта не дотянул. Три диагностики и TypeError — почините всё, не трогая интерфейс.

ts

interface Repo {
  add(item: string): void;
  all(): string[];
}
class ArrayRepo implements Repo {
  private items: string[] = [];
  add(item) {
    this.items.push(item);
  }
}
const repo = new ArrayRepo();
repo.add("первая");
console.log(repo.all()); // сейчас TypeError, а нужно ["первая"]

страница примера

Сначала предположите, что выведет код

Подсказка: одна из трёх диагностик — не про контракт, а про то, чего implements принципиально не делает.

TS2420 на строке класса говорит о пропущенном all, TS2339 в последней строке — следствие того же, а TS7006 стоит особняком: тип параметра из интерфейса не приезжает, его нужно выписать руками.

tsлистинг · не запускается

interface Repo {
  add(item: string): void;
  all(): string[];
}
class ArrayRepo implements Repo {
  private items: string[] = [];
  add(item: string): void {
    this.items.push(item);
  }
  all(): string[] {
    return this.items.slice();
  }
}
const repo = new ArrayRepo();
repo.add("первая");
console.log(repo.all()); // ["первая"]

interface Repo {
  add(item: string): void;
  all(): string[];
}
class ArrayRepo implements Repo {
  private items: string[] = [];
  add(item: string): void {
    this.items.push(item);
  }
  all(): string[] {
    return this.items.slice();
  }
}
const repo = new ArrayRepo();
repo.add("первая");
console.log(repo.all()); // ["первая"]

Копия через slice() здесь не придирка: без неё наружу уходит сам закрытый массив, и любой желающий сможет дописать в него что угодно в обход add. Приватность полей не спасает, если метод отдаёт ссылку на внутренности.

Дыра в чертеже

Абстрактный класс задаёт общий вид отчёта, наследник обязан дать строки. Сейчас наследник пустой. Прочитайте диагностику, реализуйте rows — и добавьте второй отчёт, который печатает итого: 42.

ts

abstract class Report {
  abstract rows(): string[];
  render(): string {
    return this.rows().join(" | ");
  }
}
class UsersReport extends Report {}
console.log(new UsersReport().render()); // нужно: Рико | Аня

страница примера

Сначала предположите, что выведет код

Компилятор говорит прямо: TS2515: Неабстрактный класс ' UsersReport ' не реализует унаследованный абстрактный член rows из класса ' Report ' — и указывает на строку с class, а не на место вызова. Лишние пробелы вокруг имён — особенность русского перевода сообщения, не ваша опечатка.

tsлистинг · не запускается

abstract class Report {
  abstract rows(): string[];
  render(): string {
    return this.rows().join(" | ");
  }
}
class UsersReport extends Report {
  rows(): string[] {
    return ["Рико", "Аня"];
  }
}
class SumReport extends Report {
  rows(): string[] {
    return ["итого: 42"];
  }
}
console.log(new UsersReport().render()); // Рико | Аня
console.log(new SumReport().render()); // итого: 42

abstract class Report {
  abstract rows(): string[];
  render(): string {
    return this.rows().join(" | ");
  }
}
class UsersReport extends Report {
  rows(): string[] {
    return ["Рико", "Аня"];
  }
}
class SumReport extends Report {
  rows(): string[] {
    return ["итого: 42"];
  }
}
console.log(new UsersReport().render()); // Рико | Аня
console.log(new SumReport().render()); // итого: 42

Метод render написан один раз и работает для обоих наследников — ради этого абстрактный класс и берут вместо интерфейса.

Секрет, который видно

Токен объявлен закрытым, компилятор не жалуется, а в логе он всё равно есть целиком. Сделайте так, чтобы последняя строка напечатала {}, — изменив ровно один символ в объявлении поля (и его упоминания внутри класса).

ts

class Session {
  private token = "секрет-42";
  short(): string {
    return this.token.slice(0, 7);
  }
}
const s = new Session();
console.log(s.short()); // секрет-
console.log(JSON.stringify(s)); // {"token":"секрет-42"} — а обещали спрятать

страница примера

Сначала предположите, что выведет код

Слово private заменяется решёткой. Оно исчезает при сборке, а # остаётся в собранном коде настоящим приватным полем — таким, какого нет ни в Object.keys, ни в сериализации.

tsлистинг · не запускается

class Session {
  #token = "секрет-42";
  short(): string {
    return this.#token.slice(0, 7);
  }
}
const s = new Session();
console.log(s.short()); // секрет-
console.log(JSON.stringify(s)); // {}

class Session {
  #token = "секрет-42";
  short(): string {
    return this.#token.slice(0, 7);
  }
}
const s = new Session();
console.log(s.short()); // секрет-
console.log(JSON.stringify(s)); // {}

Обращения внутри класса тоже переезжают: this.token становится this.#token. Решётка — часть имени поля, а не модификатор перед ним.

implements, abstract и приватность на уровне типов

Видеоразбор темы за 5–7 минут

implementsОбещание, которое проверяют на месте объявления

Абстрактный классЧертёж с готовыми деталями и дырами под наследника

Три модификатора доступаprivate, protected, public — и все три исчезают при сборке

Приватность делает тип номинальнымОдинаковая форма — и всё равно TS2322

Две приватности, и настоящая только однаprivate из TypeScript против #поля из части I

Итогошпаргалка по теме

Проверьте себявопросы по теме

Задачизадачи с решениями

Контракт не сошёлся

Дыра в чертеже

Секрет, который видно