TypeScript - Propriétés en lecture seule : Un guide pour les débutants

Bonjour là-bas, future superstar de la programmation ! Aujourd'hui, nous allons plonger dans le merveilleux monde de TypeScript et explorer l'une de ses fonctionnalités puissantes : les propriétés en lecture seule. Ne vous inquiétez pas si vous êtes nouveau dans la programmation ; je serai votre guide amical pour cette aventure passionnante. Alors, prenez votre boisson favorite, installez-vous confortablement, et embarquons ensemble dans cette aventure TypeScript !

Quelles sont les propriétés en lecture seule ?

Avant de rentrer dans les détails, comprenons ce qu'elles sont. Imaginez que vous avez un héritage familial précieux - peut-être une belle montre ancienne. Vous pouvez la regarder, l'admirer, mais vous ne pouvez pas la modifier. C'est exactement ce que sont les propriétés en lecture seule dans TypeScript - des valeurs que vous pouvez voir et utiliser, mais que vous ne pouvez pas modifier une fois qu'elles sont définies.

Syntaxe

Commençons par les bases. Comment déclarons-nous une propriété en lecture seule ? C'est aussi simple que d'ajouter le mot-clé readonly avant le nom de la propriété. Voici un exemple de base :

class Heirloom {
readonly name: string;

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

const familyWatch = new Heirloom("La montre de Grand-père");
console.log(familyWatch.name); // Output: La montre de Grand-père
// familyWatch.name = "Nouvelle montre"; // Error! Can't modify a readonly property

Dans cet exemple, une fois que nous avons défini name dans le constructeur, nous ne pouvons pas le modifier plus tard. C'est comme sceller le nom de notre héritage familial dans le temps !

Les propriétés en lecture seule avec les interfaces

Les interfaces en TypeScript sont comme des plans pour les objets. Nous pouvons utiliser des propriétés en lecture seule dans les interfaces également. Voyons comment :

interface ReadonlyPerson {
readonly name: string;
readonly age: number;
}

const person: ReadonlyPerson = {
name: "Alice",
age: 30
};

console.log(person.name); // Output: Alice
// person.age = 31; // Error! Can't modify a readonly property

Ici, nous avons créé une interface ReadonlyPerson où name et age sont en lecture seule. Une fois que nous créons un objet basé sur cette interface, nous ne pouvons pas modifier ces propriétés. C'est comme créer une carte d'identité - une fois imprimée, vous ne pouvez pas effacer l'âge et écrire un nouveau !

Les propriétés en lecture seule avec les classes

Les classes sont comme des plans pour créer des objets avec à la fois des données et du comportement. Voyons comment les propriétés en lecture seule fonctionnent dans les classes :

class Book {
readonly title: string;
readonly author: string;
private _pageCount: number;

constructor(title: string, author: string, pageCount: number) {
this.title = title;
this.author = author;
this._pageCount = pageCount;
}

get pageCount(): number {
return this._pageCount;
}

addPages(pages: number) {
this._pageCount += pages;
}
}

const myBook = new Book("TypeScript 101", "Jane Doe", 200);
console.log(myBook.title); // Output: TypeScript 101
myBook.addPages(50);
console.log(myBook.pageCount); // Output: 250
// myBook.title = "JavaScript 101"; // Error! Can't modify a readonly property

Dans cet exemple, title et author sont en lecture seule, mais nous pouvons toujours modifier pageCount par une méthode. C'est comme un livre - une fois imprimé, vous ne pouvez pas changer le titre ou l'auteur, mais vous pouvez ajouter des pages (peut-être dans une édition révisée).

Les propriétés en lecture seule avec les alias de types

Les alias de types sont comme des surnoms pour les types. Nous pouvons utiliser des propriétés en lecture seule avec eux également :

type ReadonlyPoint = {
readonly x: number;
readonly y: number;
};

const point: ReadonlyPoint = { x: 10, y: 20 };
console.log(point.x, point.y); // Output: 10 20
// point.x = 30; // Error! Can't modify a readonly property

Ici, nous avons créé un type ReadonlyPoint où x et y sont en lecture seule. C'est comme définir des coordonnées sur une carte - une fois placées, vous ne pouvez pas déplacer le point !

Const vs Propriétés en lecture seule

Vous vous demandez peut-être, "Quelle est la différence entre const et readonly?" Excellent question ! Exploquons-le :

const PI = 3.14159;
// PI = 3.14; // Error! Can't reassign a const variable

class Circle {
readonly radius: number;

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

const circle = new Circle(5);
// circle.radius = 10; // Error! Can't modify a readonly property

const est utilisé pour des variables qui ne peuvent pas être réassignées. readonly est utilisé pour des propriétés qui ne peuvent pas être changées après l'initialisation. Pensez à const comme une promesse de ne pas changer le contenant, tandis que readonly est une promesse de ne pas changer le contenu.

Quand utiliser les propriétés en lecture seule ?

Alors, quand devriez-vous utiliser des propriétés en lecture seule ? Voici quelques scénarios courants :

1. Lorsque vous avez des valeurs qui ne devraient pas changer après l'initialisation.
2. Pour les objets de configuration qui devraient rester constants.
3. Pour prévenir les modifications accidentelles dans de grands codebases.
4. Lorsque vous travaillez avec des structures de données immuables.

Voici un tableau résumant les méthodes que nous avons discutées :

Méthode	Description	Exemple
Avec les Interfaces	Définir des propriétés en lecture seule dans les plans d'objets	interface ReadonlyPerson { readonly name: string; }
Dans les Classes	Créer des propriétés de classe qui ne peuvent pas être modifiées après l'initialisation	class Book { readonly title: string; }
Avec les Aliases de Types	Définir des propriétés en lecture seule dans les types personnalisés	type ReadonlyPoint = { readonly x: number; readonly y: number; }
Const vs Readonly	Utiliser const pour les variables, readonly pour les propriétés	const PI = 3.14; class Circle { readonly radius: number; }

Souvenez-vous, utiliser des propriétés en lecture seule, c'est comme fixer des règles pour votre futur vous et les autres développeurs. Cela aide à prévenir les erreurs et rend votre code plus prévisible et plus facile à entretenir.

Et voilà, mes chers élèves ! Nous avons parcouru le pays des propriétés en lecture seule dans TypeScript. J'espère que ce guide vous a éclairé. Souvenez-vous, la pratique rend parfait, donc n'ayez pas peur d'expérimenter avec ces concepts dans vos propres projets. Bonne programmation, et que vos propriétés en lecture seule restent toujours fidèles à leurs valeurs !

Credits: Image by storyset