Clean Code en TypeScript : principes et exemples pour débutants

Clean Code en TypeScript : principes et exemples pour débutants

Le code propre (Clean Code) n'est pas seulement un terme à la mode, mais une philosophie de développement qui aide à écrire des programmes compréhensibles par d'autres développeurs (et par vous-même six mois plus tard). Pour les programmeurs débutants en TypeScript, maîtriser les principes du code propre est une étape clé vers la croissance professionnelle. Dans cet article, nous allons passer en revue les règles fondamentales, donner des exemples concrets et montrer comment rendre votre code TypeScript élégant et maintenable.

Pourquoi le code propre est-il important ?

Imaginez que vous lisez un livre sans paragraphes, sans ponctuation et où tous les mots sont écrits en continu. C'est à peu près à quoi ressemble un code sale pour un autre développeur. Le code propre fait gagner du temps lors du débogage, simplifie l'ajout de nouvelles fonctionnalités et réduit le nombre de bogues. TypeScript, avec son typage strict, aide déjà à écrire un code plus fiable, mais sans respecter les principes de propreté, même un code typé peut devenir illisible.

// Mauvais : illisible\nfunction d(a:any,b:any){if(a>b){return a}else{return b}}\n\n// Bon : propre et clair\nfunction findMaxValue(firstNumber: number, secondNumber: number): number {\n    if (firstNumber > secondNumber) {\n        return firstNumber;\n    }\n    return secondNumber;\n}

Principes fondamentaux du Clean Code en TypeScript

1. Noms de variables et de fonctions significatifs

Le nom doit répondre aux questions "quoi ?" et "pourquoi ?". Évitez les abréviations d'une seule lettre (sauf pour les indices de boucles) et les noms abstraits. Utilisez camelCase pour les variables et PascalCase pour les classes.

// Mauvais\nconst d = new Date();\nconst arr = [1, 2, 3];\nfunction p(x: number) { return x * 2; }\n\n// Bon\nconst currentDate = new Date();\nconst numbersList: number[] = [1, 2, 3];\nfunction doubleValue(value: number): number {\n    return value * 2;\n}

2. Les fonctions doivent faire une seule chose

Chaque fonction doit résoudre une seule tâche. Si une fonction fait plus d'une action, divisez-la en plusieurs petites fonctions. Cela améliore la lisibilité et la testabilité.

// Mauvais : la fonction fait tout à la fois\nfunction processUserData(userData: string): void {\n    const parsed = JSON.parse(userData);\n    const isValid = parsed.name && parsed.email;\n    if (isValid) {\n        console.log(`Utilisateur ${parsed.name} inscrit`);\n        saveToDatabase(parsed);\n    }\n}\n\n// Bon : chaque fonction est responsable de son rôle\nfunction parseUserData(rawData: string): User {\n    return JSON.parse(rawData);\n}\n\nfunction validateUserData(user: User): boolean {\n    return !!user.name && !!user.email;\n}\n\nfunction registerUser(userData: string): void {\n    const user = parseUserData(userData);\n    if (validateUserData(user)) {\n        console.log(`Utilisateur ${user.name} inscrit`);\n        saveToDatabase(user);\n    }\n}

3. Évitez les nombres et chaînes magiques

Les nombres magiques sont des littéraux dont la valeur est incompréhensible sans contexte. Extrayez-les dans des constantes avec des noms explicites.

// Mauvais\nif (user.age > 18) {\n    // ...\n}\nconst discount = price * 0.1;\n\n// Bon\nconst ADULT_AGE = 18;\nconst STANDARD_DISCOUNT_RATE = 0.1;\n\nif (user.age > ADULT_AGE) {\n    // ...\n}\nconst discount = price * STANDARD_DISCOUNT_RATE;

4. Utilisez correctement les types et les interfaces

TypeScript offre des outils puissants pour décrire les données. N'abusez pas de any, préférez des types spécifiques. Créez des interfaces pour les objets complexes.

// Mauvais\nfunction createUser(name: any, age: any) {\n    return { name, age, createdAt: new Date() };\n}\n\n// Bon\ninterface User {\n    name: string;\n    age: number;\n    createdAt: Date;\n}\n\nfunction createUser(name: string, age: number): User {\n    return {\n        name,\n        age,\n        createdAt: new Date()\n    };\n}