extends

Ключове слово extends використовується у оголошеннях класів або у виразах класів для створення дочірнього класу від іншого класу.

Синтаксис

class ChildClass extends ParentClass { ... }

Опис

Ключове слово extends може використовуватись для створення підкласів з користувацьких класів, як і з вбудованих об'єктів.

Значенням .prototype батьківського класу має бути Object або null.

Приклади

Використання extends

Перший приклад створює клас на ім'я Square (квадрат) з класу на ім'я Polygon (багатокутник). Даний приклад взятий з цього зразка (джерело).

class Square extends Polygon {
  constructor(length) {
    // Тут він викликає конструктор батьківського класу
    // та надає значення ширини й довжини багатокутника
    super(length, length);
    // Заувага: У похідному класі super() має викликатися до
    // використання 'this'. Інакше виникне помилка посилання.
    this.name = 'Square';
  }

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

Використання extends із вбудованими об'єктами

Цей приклад розширює вбудований об'єкт Date. Даний приклад взяти з цього зразка (джерело).

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.

class nullExtends extends null {
  constructor() {}
}

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

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

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

Специфікація Статус Коментар
ECMAScript 2015 (6th Edition, ECMA-262)
The definition of 'extends' in that specification.
Standard Початкове визначення.
ECMAScript Latest Draft (ECMA-262)
The definition of 'extends' in that specification.
Draft

Сумісність з веб-переглядачами

Update compatibility data on GitHub
DesktopMobileServer
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung InternetNode.js
extendsChrome Full support 49
Notes
Full support 49
Notes
Notes From Chrome 42 to 48 strict mode is required. Non-strict mode support can be enabled using the flag "Enable Experimental JavaScript".
Edge Full support 13Firefox Full support 45IE No support NoOpera Full support 36Safari Full support 9WebView Android Full support 49
Notes
Full support 49
Notes
Notes From Chrome 42 to 48 strict mode is required. Non-strict mode support can be enabled using the flag "Enable Experimental JavaScript".
Chrome Android Full support 49
Notes
Full support 49
Notes
Notes From Chrome 42 to 48 strict mode is required. Non-strict mode support can be enabled using the flag "Enable Experimental JavaScript".
Firefox Android Full support 45Opera Android ? Safari iOS Full support 9Samsung Internet Android Full support Yesnodejs Full support 6.0.0
Full support 6.0.0
Full support 4.0.0
Disabled
Disabled From version 4.0.0: this feature is behind the --use_strict runtime flag.
Full support 5.0.0
Disabled
Disabled From version 5.0.0: this feature is behind the --harmony runtime flag.

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
See implementation notes.
See implementation notes.
User must explicitly enable this feature.
User must explicitly enable this feature.

Див. також