La méthode super()

Fait partie de la section Programmation Orientée Objet du Journey JavaScript de Coddy — leçon 27 sur 56.

La méthode super() crée et initialise l'objet en utilisant le constructeur de la classe parente. Elle doit être appelée avant de pouvoir ajouter des propriétés à la classe enfant.

Voyez les choses ainsi : la classe parente construit la fondation de l'objet, et super() dit « construis d'abord cette fondation » avant que la classe enfant n'ajoute ses propres fonctionnalités.

Jetons un coup d'œil à l'exemple. Créez une classe parente :

class Employee {
  constructor(name) {
    this.name = name;
  }
}

Maintenant, créez une classe enfant qui étend le parent :

class Manager extends Employee {
  constructor(name, department) {
    super(name); // Appeler le constructeur parent avec name
    this.department = department;
  }
}

Ce qui se passe ici :

constructor(name, department) - Manager a besoin à la fois du nom et du département
super(name) - Transmet name au constructeur de Employee

this.department - Définit la propriété unique de Manager

Cela crée un Manager qui possède à la fois des propriétés héritées (name) et ses propres propriétés (department) !

Créez une instance de la classe enfant :

const myManager = new Manager("Sarah", "Engineering");
console.log(myManager.name);      // "Sarah"
console.log(myManager.department); // "Engineering"

La méthode super() doit être appelée avant d'utiliser this dans le constructeur d'une classe dérivée. Si vous n'appelez pas super(), JavaScript lèvera une erreur de référence.

Défi

Étant donné une classe Salad qui étend Meal. La Salad doit avoir à la fois un name et des ingredients.

Votre tâche consiste à compléter le constructeur de la classe Salad en :

Appelant super() avec la propriété name
Définissant la propriété ingredients

Aide-mémoire

La méthode super() crée et initialise l'objet en utilisant le constructeur de la classe parente. Elle doit être appelée avant de pouvoir ajouter des propriétés à la classe enfant.

Exemple d'utilisation de super() dans une classe enfant :

class Employee {
  constructor(name) {
    this.name = name;
  }
}

class Manager extends Employee {
  constructor(name, department) {
    super(name); // Appeler d'abord le constructeur parent
    this.department = department; // Ajouter ensuite les propriétés de l'enfant
  }
}

const myManager = new Manager("Sarah", "Engineering");
console.log(myManager.name);      // "Sarah"
console.log(myManager.department); // "Engineering"

Points clés :

super() doit être appelé avant d'utiliser this dans le constructeur de l'enfant
Passez les arguments nécessaires de l'enfant au constructeur parent
JavaScript lèvera une erreur de référence (reference error) si super() n'est pas appelé

Essayez vous-même

import { Meal } from './classes.js';
import { Salad } from './classes.js';

// Code de test - ne pas modifier
const salad = new Salad("Caesar", ["lettuce", "croutons", "cheese"]);
console.log(salad.name);       // Devrait afficher "Caesar"
console.log(salad.ingredients); // Devrait afficher ["lettuce", "croutons", "cheese"]