Bonnes Pratiques JavaScript

Les bonnes pratiques permettent d’écrire du code plus propre, plus lisible et plus facile à maintenir.

Un bon développeur ne cherche pas seulement à faire fonctionner le programme.

Il cherche aussi à produire un code :

• Compréhensible
• Stable
• Maintenable
• Prévisible
• Facile à modifier

1. Utiliser const par défaut

En JavaScript moderne, on utilise généralement :

• const → valeur qui ne change pas
• let → valeur modifiable

const username = "Fred";

let score = 0;

Bonne pratique : utiliser const par défaut.

2. Utiliser des noms clairs

Les variables et fonctions doivent être faciles à comprendre.

const totalPrice = 100;

function calculateTotal() {

}

Éviter :

const x = 100;

function calc() {

}

3. Une fonction = une responsabilité

Une fonction devrait faire une seule chose.

function calculateTotal(price, tax) {

    return price + tax;

}

Éviter les fonctions géantes qui font plusieurs tâches différentes.

4. Retourner rapidement (early return)

Une bonne pratique consiste à sortir rapidement d’une fonction lorsqu’un cas invalide est détecté.

function login(user) {

    if (!user) {

        return;

    }

    console.log("Connexion");

}

Cette approche réduit les blocs imbriqués.

5. Éviter la mutation

Modifier directement des données peut créer des bugs difficiles à comprendre.

const numbers = [1, 2];

numbers.push(3);

Bonne pratique : créer une nouvelle collection.

const newNumbers = [...numbers, 3];

6. Garder le code lisible

Le code doit être facile à lire pour les autres développeurs.

if (age >= 18) {

    console.log("Majeur");

}

Utiliser :

• Indentation claire
• Espaces cohérents
• Noms explicites

7. Éviter les fonctions trop longues

Une fonction trop grosse devient difficile à comprendre.

Bonne pratique :

• Découper les responsabilités
• Créer plusieurs petites fonctions

8. Utiliser les fonctions pures

Une fonction pure retourne toujours le même résultat avec les mêmes paramètres.

function add(a, b) {

    return a + b;

}

Les fonctions pures sont plus faciles à :

• Comprendre
• Tester
• Déboguer

9. Tester le code

Les tests améliorent la stabilité du projet.

expect(add(2, 2)).toBe(4);

Les tests permettent de détecter rapidement les erreurs.

10. Utiliser JSDoc

La documentation aide à comprendre les fonctions importantes.

/**
 * Additionne deux nombres.
 *
 * @param {number} a
 * @param {number} b
 * @returns {number}
 */
function add(a, b) {

    return a + b;

}

11. Éviter la duplication

Copier le même code plusieurs fois est une mauvaise pratique.

Bonne pratique : créer une fonction réutilisable.

function displayMessage(message) {

    console.log(message);

}

12. Séparer HTML, CSS et JavaScript

Les responsabilités doivent être séparées.

13. Utiliser addEventListener()

En JavaScript moderne, on préfère :

button.addEventListener("click", handleClick);

Au lieu de :

<button onclick="handleClick()">

14. Lire les erreurs attentivement

Les messages d’erreurs donnent souvent :

• Le type d’erreur
• Le fichier concerné
• La ligne problématique

Lire les erreurs calmement fait partie du travail de développeur.

15. Penser maintenabilité

Un projet change constamment avec le temps.

Bonne pratique : écrire du code que toi ou une autre personne pourrez comprendre plus tard.

Résumé rapide