Наследование классов

Запись class Dog extends Animal говорит движку: если у Dog метода нет — ищи его у Animal. Технически прототип Dog.prototype начинает указывать на Animal.prototype, и поиск метода просто идёт на одну ступень выше.

class Animal {
  constructor(name) { this.name = name; }
  speak() { return `${this.name} издаёт звук`; }
}
class Dog extends Animal {}
const rex = new Dog("Рекс");
console.log(rex.speak());
console.log(rex instanceof Animal);

У Dog нет ни одной собственной строки, но объект уже умеет всё, что умел родитель. Это и есть главный смысл наследования: не переписывать общее, а уточнять частное.

extends тянет и статику: Dog.create() найдётся, если он объявлен у Animal.

class Stack extends Array {
  peek() { return this[this.length - 1]; }
}
const s = new Stack();
s.push(1, 2);
console.log(s.peek(), s.length);

Если у потомка есть свой constructor, он обязан вызвать super(...) — и сделать это раньше любого обращения к this. Причина честнее, чем «так принято»: конструктор потомка не создаёт объект сам. Объект создаёт конструктор родителя, а super() — это и есть момент его создания.

class Animal {
  constructor(name) { this.name = name; }
}
class Dog extends Animal {
  constructor(name, breed) { super(name); this.breed = breed; }
}
const rex = new Dog("Рекс", "корги");
console.log(rex.name, rex.breed);

Переставьте строки местами — и получите ошибку. До super() переменной this просто не существует, и обращение к ней падает так же, как к переменной до её объявления.

class Animal { constructor(name) { this.name = name; } }
class Cat extends Animal {
  constructor(name) { this.lives = 9; super(name); }
}
try { new Cat("Мурка"); }
catch (err) { console.log(err.constructor.name); }

Если конструктор потомку не нужен, его можно не писать вовсе — движок подставит невидимый constructor(...args) { super(...args); }, который передаст родителю все аргументы как есть.

Метод потомка с тем же именем полностью закрывает собой родительский. Но чаще нужно не «вместо», а «поверх»: взять результат родителя и что-то с ним сделать. Для этого и есть super.метод() — вызов родительской версии с текущим this.

class Logger {
  format(text) { return `[log] ${text}`; }
}
class ShoutLogger extends Logger {
  format(text) { return super.format(text).toUpperCase(); }
}
console.log(new ShoutLogger().format("ok"));

Обратите внимание: super.format — это не «метод родительского объекта», отдельного объекта-родителя не существует. Это поиск метода на ступень выше по цепочке прототипов, но выполняется он на том же самом экземпляре.

class A { hi() { return "A"; } }
class B extends A {
  hi() { return super.hi() + "B"; }
}
const fn = new B().hi;
console.log(fn.call({}));

Поля класса (value = 1 прямо в теле) выглядят просто, но у них есть свой момент выполнения. У родителя они срабатывают в начале его конструктора, у потомка — сразу после возврата из super(). Значит, поле потомка перезаписывает одноимённое поле родителя.

class Base {
  value = "база";
  constructor() { console.log(this.value); }
}
class Child extends Base {
  value = "потомок";
  constructor() { super(); console.log(this.value); }
}
new Child();

Отсюда популярная ловушка: конструктор родителя вызывает метод, который потомок переопределил, а тот опирается на поле потомка. Поля ещё не проинициализированы — получаем undefined.

class Form {
  constructor() { console.log(this.title()); }
  title() { return "форма"; }
}
class Login extends Form {
  label = "Вход";
  title() { return this.label; }
}
new Login();

Практический вывод: не вызывайте из конструктора родителя методы, которые потомок может переопределить. Если без этого никак — вынесите такой вызов в отдельный метод init(), который потомок дёрнет сам, когда будет готов.

Наследование — самая жёсткая связь между классами: потомок зависит от каждой детали родителя, включая те, что ему не нужны. Проверка простая. Если про потомка можно сказать «это разновидность родителя» — наследование уместно. Если получается «внутри него есть родитель» — нужна композиция.

Композиция — это когда объект не наследует умение, а держит внутри другой объект, который умеет. Меняется только поле, а не форма всего дерева классов.

class Engine {
  start() { return "мотор запущен"; }
}
class Car {
  engine = new Engine();
  start() { return `Машина: ${this.engine.start()}`; }
}
console.log(new Car().start());

Вариант Car extends Engine тоже «заработал бы»: машина получила бы start(). Но заодно и всё остальное содержимое мотора, а поменять мотор на электрический стало бы невозможно без переписывания класса. Наследование стоит брать, когда общее поведение действительно одно на всех и меняться не будет; в остальных случаях сначала пробуйте композицию.