extends

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2016.

Ключевое слово extends используется в объявлении класса или в выражениях класса для создания дочернего класса.

Синтаксис

class ChildClass extends ParentClass { ... }

Описание

Ключевое слово extends может быть использовано для создания дочернего класса для уже существующего класса или встроенного объекта.

Свойство .prototype родительского класса или объекта должно быть Object или null.

Примеры

Использование extends

В первом примере создаётся дочерний класс с именем Square от класса с именем Polygon. Этот пример был взят из live demo (source).

js
class Square extends Polygon {
  constructor(length) {
    // Здесь вызывается конструктор родительского класса,
    // в который передаётся свойство length в качестве
    // аргументов, соответствующих полям width и height,
    // класса Polygon
    super(length, length);
    // Примечание:
    // В конструкторе класса, метод super() должен быть вызван
    // перед использованием this. В противном случае, будет
    // выброшена ошибка.
    this.name = "Square";
  }

  get area() {
    return this.height * this.width;
  }
}

Расширение встроенных объектов с помощью extends

Этот пример расширяет встроенный объект Date. Пример взят из live demo (source).

js
class myDate extends Date {
  constructor() {
    super();
  }

  getFormattedDate() {
    var months = [
      "Jan",
      "Feb",
      "Mar",
      "Apr",
      "May",
      "Jun",
      "Jul",
      "Aug",
      "Sep",
      "Oct",
      "Nov",
      "Dec",
    ];
    return (
      this.getDate() + "-" + months[this.getMonth()] + "-" + this.getFullYear()
    );
  }
}

Расширение null

Расширение null работает как и с обычным классом, за исключением того, что прототип объекта не наследует Object.prototype.

js
class nullExtends extends null {
  constructor() {}
}

Object.getPrototypeOf(nullExtends); // Function.prototype
Object.getPrototypeOf(nullExtends.prototype); // null

new nullExtends(); //ReferenceError: this is not defined

Спецификации

Specification
ECMAScript® 2025 Language Specification
# sec-class-definitions

Совместимость с браузерами

Report problems with this compatibility data on GitHub
desktopmobileserver
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Deno
Node.js
extends

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
Has more compatibility info.

Смотрите также