Comment définir et utiliser les classes TypeScript ?

Les classes TypeScript fournissent une méthode organisée et transparente pour structurer les données et les actions au sein d’un objet. Cela rend la modélisation des entités et des concepts dans votre code plus simple et plus intuitive.

À quoi servent les classes TypeScript ?

Les classes sont un concept clé du langage de programmation TypeScript, basé sur JavaScript. Elles représentent une méthode structurée pour créer des objets selon le principe de la programmation orientée objet (OOP, Object-Oriented Programming). Ces classes agissent comme des schémas, permettant de générer des objets qui intègrent à la fois des données et des fonctions étroitement connectées.

TypeScript contient toutes les fonctions de JavaScript et comprend en plus le typage statique. Il est ainsi possible de spécifier des types de données pour des fonctions TypeScript, des variables et des classes afin de détecter les erreurs lors de la compilation. Outre la sécurité des types, les classes TypeScript prennent en charge des concepts tels que l’héritage et l’abstraction, ce qui facilite le développement d’applications complexes.

En utilisant les classes TypeScript, il est possible d’établir une hiérarchie ordonnée de classes permettant l’héritage de propriétés et de méthodes, ce qui encourage la réutilisation du code et sa structuration efficace. Les constructeurs au sein de ces classes jouent un rôle crucial en initialisant les instances, assurant ainsi une création d’objets uniforme et conforme.

Comment se présente la syntaxe des classes TypeScript ?

L’écriture des classes TypeScript est similaire à celle de ECMAScript 6 (ES6) et constitue une version plus élaborée de la syntaxe des classes JavaScript. Une classe en TypeScript peut contenir différents éléments pour définir la structure et le comportement des objets. Les principaux éléments sont :

• Propriétés
• Constructeur
• Méthodes

Propriétés

Les propriétés déterminent l’état d’un objet. Elles stockent des valeurs de données et peuvent être annotées avec des types de données afin qu’elles ne contiennent que des valeurs valides.

class ClassName {
    propertyName: propertyType;
}

• ClassName : le nom de la classe
• propertyName : le nom de la propriété que vous souhaitez définir
• propertyType : le type de données de la propriété

Voici un exemple concret :

class Person {
    name: string;
}

Tout d’abord, une classe Person est définie avec une propriété name de type string. Cela signifie que les instances de la classe Person ont une propriété name qui stocke des chaînes de caractères (strings).

Constructeur

En TypeScript, le constructeur est une méthode unique activée au moment de générer une instance (un objet) d’une classe. Son rôle est crucial pour définir les propriétés initiales d’un objet. Par ailleurs, ce constructeur établit l’état de départ de l’instance. Il est possible d’y insérer des paramètres afin de fournir des valeurs spécifiques lors de la création d’instances de classes TypeScript.

La syntaxe de base d’un constructeur en TypeScript est la suivante :

class ClassName {
    constructor(parameter1: Type1, parameter2: Type2, ...) {
    }
}

• constructor : chaque classe ne peut avoir qu’un seul constructeur. Si aucun constructeur n’est défini, un constructeur vide est créé par défaut.
• parameter: type : les paramètres sont facultatifs et dépendent de la classe et de ses exigences. Les paramètres doivent être identifiés par leur type de données.

Voici un exemple de constructeur :

class Person {
    firstName: string;
    lastName: string;
    constructor(firstName: string, lastName: string) {
        this.firstName = firstName;
        this.lastName = lastName;
    }
}

Dans cet exemple, la classe Person comprend un constructeur qui requiert deux paramètres, firstName et lastName. À la création d’une instance de la classe, ces paramètres doivent être fournis, permettant au constructeur d’attribuer les valeurs reçues aux propriétés firstName et lastName de l’instance. Le terme this est utilisé pour faire référence à l’instance en cours de la classe, sur laquelle le code s’exécute.

Méthodes

Dans TypeScript, les méthodes sont des fonctions qui peuvent être définies dans les classes et appliquées à leurs instances. Les méthodes vous permettent d’effectuer certaines actions ou opérations dans le contexte d’une classe.

class ClassName {
    // ...
    methodName(parameter1: Type1, parameter2: Type2, ...): ReturnType {
    }
    // ...
}

• methodName : nom de la méthode
• parameter: type : paramètres optionnels acceptés par la méthode
• ReturnType : type de données qui détermine la valeur que la méthode renvoie. Si la méthode ne renvoie rien, vous pouvez indiquer void.

Pour accéder à une propriété ou appeler une méthode sur une instance d’une classe, utilisez l’opérateur point . suivi du nom de la méthode et des arguments nécessaires si la méthode attend des paramètres.

class Person {
    firstName: string;
    lastName: string;
    constructor(firstName: string, lastName: string) {
        this.firstName = firstName;
        this.lastName = lastName;
    }
    getFullName(): string {
        return this.firstName + " " + this.lastName;
    }
}
const person = new Person("John", "Doe");
const fullName = person.getFullName();

La méthode getFullName sert à créer et à renvoyer le nom complet de la personne. Elle accède aux valeurs des propriétés firstName et lastName, qui ont été définies dans la classe et initialisées dans le constructeur. L’objet person est créé par le mot-clé new suivi du nom de la classe et des paramètres correspondants. Lors de l’appel, la méthode concaténera les deux chaînes de caractères et renverra le nom complet sous forme de chaîne de caractères. Le résultat pour l’objet person est donc « John Doe ».

Les classes TypeScript : exemples d’utilisation

Les classes TypeScript possèdent différents mécanismes permettant d’organiser et de contrôler la structure et le comportement des objets. Nous vous présentons ci-dessous différentes utilisations.

Visibilité

La visibilité dans les classes TypeScript régit l’accès aux propriétés et aux méthodes à l’intérieur et à l’extérieur de la classe. TypeScript propose trois modificateurs de visibilité : public, private et protected.

• public (standard) : les propriétés et méthodes marquées par public peuvent être appelées de n’importe où, aussi bien à l’intérieur qu’à l’extérieur de la classe.
• private : private se réfère aux propriétés et méthodes qui ne peuvent être appelées qu’à l’intérieur de la classe elle-même. Elles sont inaccessibles aux parties de code externes.
• protected : les propriétés et méthodes marquées par protected peuvent être appelées par la classe elle-même et par les classes dérivées (dans l’héritage), mais pas par du code externe.

class Person {
    private socialSecurityNumber: string;
    constructor(ssn: string) {
        this.socialSecurityNumber = ssn;
    }
    greet() {
        console.log("Hello, I am a person with SSN: " + this.socialSecurityNumber);
    }
}
const person = new Person("123-45-6789");
person.greet();

Dans cet exemple, socialSecurityNumber est une propriété privée qui n’est accessible qu’à l’intérieur de la classe Person. La méthode greet peut cependant être appelée de l’extérieur.

Héritage

L’héritage est un concept fondamental de la programmation orientée objet, utilisé dans TypeScript et dans de nombreux autres langages de programmation Web. Il permet de créer une nouvelle classe à partir d’une classe de base ou d’une superclasse existante. La classe dérivée (sous-classe) hérite alors des propriétés et des méthodes de la classe de base et peut l’étendre ou l’adapter.

class Animal {
    name: string;
    constructor(name: string) {
        this.name = name;
    }
    makeSound() {
        console.log("Some generic sound");
    }
}
class Dog extends Animal {
    makeSound() {
        console.log(this.name + " barks");
    }
}
const myDog = new Dog("Buddy");
myDog.makeSound();

Ici, la classe Dog hérite de la classe de base Animal à l’aide du mot-clé extends. La classe dérivée Dog écrase la méthode makeSound pour ajouter un comportement spécifique, tout en prenant la propriété name de Animal.

Readonly

Le mot-clé readonly peut être utilisé pour déclarer des propriétés de classes ou d’objets TypeScript comme en lecture seule (Read only). Cela signifie qu’après l’initialisation d’une propriété en lecture seule, sa valeur ne peut plus être modifiée.

class Circle {
    readonly pi: number = 3.14159;
    radius: number;
    constructor(radius: number) {
        this.radius = radius;
    }
    getArea() {
        return this.pi    *this.radius*    this.radius;
    }
}
const myCircle = new Circle(5);
console.log(myCircle.getArea()); // Output: ≈ 78,54

Dans cet exemple, la propriété pi est définie comme étant en lecture seule et reçoit une valeur lors de l’initialisation dans le constructeur. Une fois initialisée, la modification de pi est interdite. Toute tentative de changer sa valeur après son initialisation entraînera une erreur de compilation par TypeScript.