Constantes en TypeScript : comment les déclarer et les utiliser dans les classes

Constantes dans les classes TypeScript : du débutant au professionnel

Avez-vous déjà écrit du code en TypeScript et réalisé soudainement : « Cette chaîne magique "ADMIN" que j'utilise à dix endroits, si je fais une faute de frappe, le compilateur ne dira rien » ? Une douleur familière. Ou pire encore, un membre de l'équipe modifie la valeur d'une constante directement à l'exécution, et vous passez une heure à déboguer pour comprendre pourquoi tout est cassé.

Bienvenue dans le monde des constantes de classe en TypeScript. Ce n'est pas simplement du sucre syntaxique — c'est le fondement d'une architecture propre, prévisible et sécurisée. Dans cet article, nous allons passer en revue toutes les façons de déclarer des constantes dans les classes TypeScript : du simple readonly aux techniques avancées avec as const et les génériques. C'est parti !

Pourquoi les constantes dans les classes sont-elles importantes ?

Imaginez que vous développez une application pour une boutique en ligne. Vous avez une classe Order, et elle contient des statuts : "pending", "shipped", "delivered". Si vous dispersez ces chaînes dans tout le code, tôt ou tard quelqu'un écrira "PENDING" en majuscules — et le bug est garanti. Les constantes de classe TypeScript résolvent ce problème une fois pour toutes.

\n
• Sécurité des types : le compilateur ne permettra pas de passer "pendingg" là où "pending" est attendu.
\n
• Lisibilité : OrderStatus.Pending est plus clair qu'une simple chaîne.
\n
• Maintenance : modifier la valeur à un endroit la change partout.
\n

Méthode n°1 : readonly — la base, mais avec des nuances

La méthode la plus simple consiste à utiliser le modificateur readonly. Il interdit la modification du champ après l'initialisation.

class AppConfig {\n    readonly API_URL: string = 'https://api.example.com';\n    readonly MAX_RETRIES: number = 3;\n}\n\nconst config = new AppConfig();\nconsole.log(config.API_URL); // 'https://api.example.com'\n// config.API_URL = 'new-url'; // Erreur ! Impossible d'assigner à 'API_URL' car c'est une propriété en lecture seule.

Mais il y a un piège : readonly ne fonctionne qu'au niveau de TypeScript. Dans le JavaScript compilé, ces champs peuvent toujours être modifiés. Pour une protection complète, utilisez Object.freeze ou # (champs privés).

Méthode n°2 : static readonly — le roi des constantes

Si la constante n'est pas liée à une instance spécifique de la classe (ce qui est le cas dans 99% des situations), utilisez static readonly. C'est le modèle classique de class constant typescript.

class MathConstants {\n    static readonly PI: number = 3.14159;\n    static readonly E: number = 2.71828;\n    static readonly GOLDEN_RATIO: number = 1.61803;\n}\n\n// Accès sans créer d'instance\nconsole.log(MathConstants.PI); // 3.14159\n// MathConstants.PI = 3.14; // Erreur !

Cette approche est idéale pour les configurations, les constantes mathématiques, les statuts et toutes les valeurs qui ne doivent pas changer.

Méthode n°3 : enum — quand il y a beaucoup de constantes

Si vous avez un groupe de constantes liées (par exemple, les statuts d'une commande), enum est votre meilleur ami. Il crée un ensemble nommé de valeurs.

enum OrderStatus {\n    Pending = 'pending',\n    Shipped = 'shipped',\n    Delivered = 'delivered',\n    Cancelled = 'cancelled'\n}\n\nclass Order {\n    constructor(public status: OrderStatus) {}\n}\n\nconst order = new Order(OrderStatus.Pending);\nconsole.log(order.status); // 'pending'\n\n// order.status = 'pendingg'; // Erreur ! Le type '"pendingg"' n'est pas assignable au type 'OrderStatus'

Conseil : si vous utilisez des enum de chaînes (comme dans l'exemple), elles donnent des valeurs lisibles à l'exécution. Les enum numériques sont plus rapides, mais plus difficiles à déboguer.

Méthode n°4 : as const — pour une rigueur maximale

Parfois, vous voulez qu'un objet ou un tableau devienne cons