Concept de base des classes ES6
Les classes en ES6 représentent une forme de sucre syntaxique pour implémenter l'héritage prototypal traditionnel de JavaScript. Elles offrent une syntaxe plus claire tout en conservant les mécanismes fondamentaux d'ECMAScript 5.
Constructeur par défaut
// Syntaxe ES5 traditionnelle
function Rectangle(largeur, hauteur) {
this.largeur = largeur;
this.hauteur = hauteur;
}
Rectangle.prototype.obtenirDimensions = function() {
return `L:${this.largeur}, H:${this.hauteur}`;
};
// Équivalent ES6
class Rectangle {
constructor(largeur, hauteur) {
this.largeur = largeur;
this.hauteur = hauteur;
}
obtenirDimensions() {
return `L:${this.largeur}, H:${this.hauteur}`;
}
}
Caractéristiques clés du constructeur :
- Appel automatique lors de l'instanciation via
new - Un constructeur par défaut est toujours présent, même non déclaré
- Peut retourner un objeet personnalisé au lieu de
this
Mécanisme de super
Le mot-clé super permet d'accéder aux propriétés et méthodes de la classe parente. Deux modes d'utilisation principaux :
Appel du constructeur parent
class Forme {
constructor() {
console.log("Initialisation Forme");
}
}
class Cercle extends Forme {
constructor(rayon) {
super(); // Obligatoire dans les sous-classes
this.rayon = rayon;
}
}
Points critiques :
- Obligation d'appeler
super()avant d'utiliserthis super()retourne l'instance de la sous-classe- Le contexte
thisà l'intérieur desuper()fait référence à la sous-classe
Accès aux méthodes parentes
class Figure {
calculerAire() {
return 0;
}
}
class Carre extends Figure {
constructor(cote) {
super();
this.cote = cote;
}
calculerAire() {
// Appel de la méthode parente
console.log("Méthode parente:", super.calculerAire());
return this.cote ** 2;
}
}
Comportements spécifiques :
- Dans les méthodes normales,
superréférencePrototypede la classe parente - Le contexte
thisreste lié à la sous-classe lors des appels viasuper - Les assignations via
superaffectent directementthisde la sous-classe
Contraintes et bonnes pratiques
superdoit être utilisé explicitement soit comme fonction, soit comme objet- Les sous-classes doivent toujours appeler
super()dans leur constructeur - Le mot-clé
new.targetdanssuper()référence toujours la sous-classe appelante