Classe JavaScript

JavaScript n’a jamais eu, sous le capot, un système de classes comparable à celui de langages comme Java ou PHP : son mécanisme d’origine repose sur les prototypes, une chaîne d’objets qui se transmettent leurs propriétés. La syntaxe class, apparue avec ES6, n’a rien changé à ce fonctionnement interne : elle offre seulement une écriture plus familière et plus lisible, tout en générant en coulisses exactement le même mécanisme de prototypes.

Classes dans le JavaScript de WordPress

L’éditeur de blocs et les composants d’interface qui l’entourent utilisent principalement des fonctions plutôt que des classes pour les composants React modernes, mais la syntaxe class reste très présente dans le code plus ancien de l’écosystème, ainsi que pour définir un élément personnalisé (Web Component), qui doit obligatoirement étendre la classe native HTMLElement.

Exemple

class MonCompteur extends HTMLElement {
  connectedCallback() {
    this.textContent = '0';
  }
}
customElements.define( 'mon-compteur', MonCompteur );

Pièges fréquents

• Oublier le mot-clé new lors de l’instanciation : contrairement à une fonction classique, une classe déclarée avec class lève une erreur explicite si on l’appelle sans new.
• Confondre méthode de classe et fonction fléchée à l’intérieur : le mot this ne se comporte pas de la même façon selon la syntaxe utilisée, une source classique de bugs de contexte.
• Croire qu’une classe JavaScript crée un type strictement isolé comme dans certains langages compilés : le typage reste dynamique, une classe ne bloque pas l’ajout de propriétés inattendues à une instance.