extends

Le mot-clé extends est utilisé dans les déclarations et expressions de classes afin de signifier qu'un type représenté par une classe hérite d'un autre type.

Syntaxe

class ClasseFille extends ClasseParente { ... }

Description

Le mot-clé extends peut être utilisé pour créer des sous-classes de classes existantes (natives ou non).

La propriété .prototype d'une classe fille (aussi appelée une extension) doit être un Object ou null.

Exemples

Utiliser extends

Ce fragment de code est tiré de cet exemple et crée une classe Carré qui hérite de Polygone :

class Carré extends Polygone {
  constructor(longueur) {
    // On utilise le constructeur de la classe parente
    // avec le mot-clé super
    super(longueur, longueur);
    // Pour les classes dérivées, super() doit être appelé avant de
    // pouvoir utiliser 'this' sinon cela provoque une exception
    // ReferenceError
    this.nom = 'Carré';
  }

  get aire() {
    return this.hauteur * this.largeur;
  }

}

Utiliser extends avec des objets natifs

Dans l'exemple suivant, on crée l'équivalent d'une sous-classe pour Date :

class maDate extends Date {
  constructor() {
    super();
  }

  getFormattedDate() {
    var mois = ['Jan','Fév','Mar','Avr','Mai','Juin','Juil','Août','Sep','Oct','Nov','Déc'];
    return this.getDate() + "-" + mois[this.getMonth()] + "-" + this.getFullYear();
  }
}

Ces exemples sont extraits de ces deux pages : démonstration, source.

Étendre null

Étendre null se fait comme avec une classe normale sauf que l'objet prototype n'hérite pas de Object.prototype.

class extensionNull extends null {
  constructor() {}
}

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

new extensionNull(); // ReferenceError

Spécifications

Spécification État Commentaires
ECMAScript 2015 (6th Edition, ECMA-262)
La définition de 'extends' dans cette spécification.
Standard Définition initiale.
ECMAScript (ECMA-262)
La définition de 'extends' dans cette spécification.
Standard évolutif

Compatibilité des navigateurs

Update compatibility data on GitHub
OrdinateurMobileServeur
ChromeEdgeFirefoxInternet ExplorerOperaSafariWebview AndroidChrome pour AndroidFirefox pour AndroidOpera pour AndroidSafari sur iOSSamsung InternetNode.js
extendsChrome Support complet 49
Support complet 49
Aucun support 42 — 49
Notes
Notes Strict mode is required.
Aucun support 42 — 49
Désactivée
Désactivée From version 42 until version 49 (exclusive): this feature is behind the Experimental JavaScript preference (needs to be set to Enabled). To change preferences in Chrome, visit chrome://flags.
Edge Support complet 13Firefox Support complet 45IE Aucun support NonOpera Support complet 36
Support complet 36
Aucun support 29 — 36
Notes
Notes Strict mode is required.
Aucun support 29 — 36
Désactivée
Désactivée From version 29 until version 36 (exclusive): this feature is behind the Experimental JavaScript preference (needs to be set to Enabled).
Safari Support complet 9WebView Android Support complet 49
Support complet 49
Aucun support 42 — 49
Notes
Notes Strict mode is required.
Chrome Android Support complet 49
Support complet 49
Aucun support 42 — 49
Notes
Notes Strict mode is required.
Aucun support 42 — 49
Désactivée
Désactivée From version 42 until version 49 (exclusive): this feature is behind the Experimental JavaScript preference (needs to be set to Enabled). To change preferences in Chrome, visit chrome://flags.
Firefox Android Support complet 45Opera Android Support complet 36
Support complet 36
Aucun support 29 — 36
Notes
Notes Strict mode is required.
Aucun support 29 — 36
Désactivée
Désactivée From version 29 until version 36 (exclusive): this feature is behind the Experimental JavaScript preference (needs to be set to Enabled).
Safari iOS Support complet 9Samsung Internet Android Support complet 5.0
Support complet 5.0
Aucun support 4.0 — 5.0
Notes
Notes Strict mode is required.
nodejs Support complet 6.0.0
Support complet 6.0.0
Support complet 4.0.0
Désactivée
Désactivée From version 4.0.0: this feature is behind the --use_strict runtime flag.
Support complet 5.0.0
Désactivée
Désactivée From version 5.0.0: this feature is behind the --harmony runtime flag.

Légende

Support complet  
Support complet
Aucun support  
Aucun support
Voir les notes d'implémentation.
Voir les notes d'implémentation.
Une action explicite de l'utilisateur est nécessaire pour activer cette fonctionnalité.
Une action explicite de l'utilisateur est nécessaire pour activer cette fonctionnalité.

Voir aussi