TypeScript - Héritage

Bonjour, futurs programmeurs ! Aujourd'hui, nous allons entreprendre un voyage passionnant à travers le monde de l'héritage en TypeScript. En tant que votre professeur d'informatique de quartier, je suis là pour vous guider à travers ce sujet fascinant. Alors, prenez vos sacs à dos virtuels, et plongons dedans !

Qu'est-ce que l'Héritage ?

Avant de commencer, comprenons ce que signifie réellement l'héritage. Imaginez que vous créez un arbre généalogique. Chaque nouvelle génération hérite de certains traits de leurs parents. En programmation, l'héritage fonctionne de manière similaire. Il permet à une nouvelle classe d'être basée sur une classe existante, héritant de ses propriétés et méthodes. Génial, non ?

Héritage Simple

Commençons par la forme la plus simple d'héritage : l'héritage simple. C'est lorsque une classe (classe enfant) hérite d'une autre classe (classe parent).

Exemple de Base

class Animal {
name: string;

constructor(name: string) {
this.name = name;
}

makeSound(): void {
console.log("Un son d'animal générique");
}
}

class Dog extends Animal {
breed: string;

constructor(name: string, breed: string) {
super(name);
this.breed = breed;
}

makeSound(): void {
console.log("Wouf ! Wouf !");
}
}

let myDog = new Dog("Buddy", "Golden Retriever");
console.log(myDog.name);  // Output: Buddy
console.log(myDog.breed); // Output: Golden Retriever
myDog.makeSound();        // Output: Wouf ! Wouf !

Dans cet exemple, Dog hérite de Animal. Le mot-clé extends est utilisé pour créer une classe qui est l'enfant d'une autre classe.

Explication

1. Nous définissons une classe de base Animal avec une propriété name et une méthode makeSound.
2. Ensuite, nous créons une classe Dog qui étend Animal.
3. La classe Dog a sa propre propriété breed.
4. Nous utilisons le mot-clé super dans le constructeur Dog pour appeler le constructeur Animal.
5. Nous surchargeons la méthode makeSound dans la classe Dog.

Mot-clé Super

Vous avez peut-être remarqué le mot-clé super dans notre exemple précédent. Plongeons plus profondément dans ce qu'il fait.

Exemple avec Super

class Vehicle {
make: string;
model: string;

constructor(make: string, model: string) {
this.make = make;
this.model = model;
}

getInfo(): string {
return `${this.make} ${this.model}`;
}
}

class Car extends Vehicle {
numDoors: number;

constructor(make: string, model: string, numDoors: number) {
super(make, model);
this.numDoors = numDoors;
}

getInfo(): string {
return `${super.getInfo()} avec ${this.numDoors} portes`;
}
}

let myCar = new Car("Toyota", "Corolla", 4);
console.log(myCar.getInfo()); // Output: Toyota Corolla avec 4 portes

Explication

1. Le mot-clé super est utilisé dans le constructeur Car pour appeler le constructeur Vehicle.
2. Dans la méthode getInfo de Car, nous utilisons super.getInfo() pour appeler la méthode getInfo de la classe parent.

Le mot-clé super nous permet d'accéder et d'appeler des fonctions sur l'objet parent.

Surcharge de Méthode

La surcharge de méthode se produit lorsque une classe enfant fournit une implémentation spécifique d'une méthode déjà définie dans sa classe parent. Nous avons en fait vu cela dans nos deux exemples précédents !

Un Autre Exemple de Surcharge de Méthode

class Shape {
getArea(): number {
return 0;
}
}

class Circle extends Shape {
radius: number;

constructor(radius: number) {
super();
this.radius = radius;
}

getArea(): number {
return Math.PI * this.radius * this.radius;
}
}

class Rectangle extends Shape {
width: number;
height: number;

constructor(width: number, height: number) {
super();
this.width = width;
this.height = height;
}

getArea(): number {
return this.width * this.height;
}
}

let myCircle = new Circle(5);
console.log(myCircle.getArea()); // Output: 78.53981633974483

let myRectangle = new Rectangle(4, 5);
console.log(myRectangle.getArea()); // Output: 20

Explication

1. Nous avons une classe de base Shape avec une méthode getArea qui renvoie 0.
2. Les classes Circle et Rectangle étendent Shape et surchargent la méthode getArea avec leurs propres implémentations.
3. La classe Circle calcule l'aire en utilisant la formule πr².
4. La classe Rectangle calcule l'aire en multipliant la largeur et la hauteur.

Héritage Multiniveau

L'héritage multiniveau implique qu'une classe enfant hérite d'une autre classe enfant. C'est comme un arbre généalogique avec plusieurs générations.

Exemple d'Héritage Multiniveau

class Grandparent {
surname: string;

constructor(surname: string) {
this.surname = surname;
}

getSurname(): string {
return this.surname;
}
}

class Parent extends Grandparent {
firstName: string;

constructor(firstName: string, surname: string) {
super(surname);
this.firstName = firstName;
}

getFullName(): string {
return `${this.firstName} ${this.getSurname()}`;
}
}

class Child extends Parent {
middleName: string;

constructor(firstName: string, middleName: string, surname: string) {
super(firstName, surname);
this.middleName = middleName;
}

getFullName(): string {
return `${this.firstName} ${this.middleName} ${this.getSurname()}`;
}
}

let myChild = new Child("John", "Doe", "Smith");
console.log(myChild.getFullName()); // Output: John Doe Smith

Explication

1. Nous avons une classe Grandparent avec une propriété surname.
2. La classe Parent étend Grandparent et ajoute une propriété firstName.
3. La classe Child étend Parent et ajoute une propriété middleName.
4. Chaque classe a sa propre implémentation de la méthode getFullName.

Résumé des Méthodes d'Héritage

Voici un tableau résumant les méthodes et mots-clés clés que nous avons discutés :

Méthode/Mot-clé	Description
extends	Utilisé pour créer une classe en tant qu'enfant d'une autre classe
super()	Appelle le constructeur de la classe parent
super.method()	Appelle une méthode de la classe parent
Surcharge de Méthode	Fournir une nouvelle implémentation pour une méthode dans une classe enfant

Et voilà ! Nous avons couvert les bases de l'héritage en TypeScript. Souvenez-vous, la pratique rend parfait, donc n'hésitez pas à expérimenter avec ces concepts. Bonne programmation, futurs magiciens TypeScript !

Credits: Image by storyset