Utiliser super

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

Lorsque vous redéfinissez une méthode, vous pouvez toujours accéder à la version originale du parent en utilisant super.methodName(). Cela vous permet d'étendre ou de modifier le comportement du parent au lieu de le remplacer complètement.

Créez une classe parente avec une méthode :

class Animal {
  makeSound() {
    return "Generic animal sound";
  }
}

Créez une classe enfant qui étend le parent :

class Dog extends Animal {
  makeSound() {
    // Appelez d'abord la méthode du parent
    const parentSound = super.makeSound();
    // Puis étendez avec des fonctionnalités supplémentaires
    return `${parentSound}, but also Woof!`;
  }
}

Créez une instance de la classe enfant :

const myDog = new Dog();
console.log(myDog.makeSound());
// Sortie : "Generic animal sound, but also Woof!"

Le mot-clé super vous permet d'appeler les méthodes de la classe parente tout en ajoutant votre propre fonctionnalité dans la classe enfant.

Défi

On vous donne une classe Shape avec une méthode calculateArea() et une classe Rectangle qui l'étend. Votre tâche consiste à remplacer (override) la méthode calculateArea() dans Rectangle en utilisant super.

Votre tâche est de compléter la méthode calculateArea() dans la classe Rectangle pour :

Appeler la méthode calculateArea() du parent en utilisant super et stocker le résultat
Calculer l'aire réelle du rectangle : width × height
Retourner une chaîne combinée : message du parent + aire du rectangle. Exemple : Calculating area... Rectangle area: 50

Aide-mémoire

Utilisez super.methodName() pour accéder à la méthode originale de la classe parente lors d'une redéfinition :

class Animal {
  makeSound() {
    return "Generic animal sound";
  }
}

class Dog extends Animal {
  makeSound() {
    const parentSound = super.makeSound();
    return `${parentSound}, but also Woof!`;
  }
}

const myDog = new Dog();
console.log(myDog.makeSound());
// Résultat : "Generic animal sound, but also Woof!"

Cela vous permet d'étendre les fonctionnalités de la classe parente au lieu de les remplacer complètement.

Essayez vous-même

import { Shape } from './shapes.js';
import { Rectangle } from './shapes.js';

// Code de test - ne pas modifier
const rectangle = new Rectangle(5, 10);
console.log(rectangle.calculateArea()); // Attendu : "Calculating area... Rectangle area: 50"