2024 11 25 093814

Introduction#

Dans ce billet, nous allons examiner les meilleures pratiques pour créer des noms de variables et de fonctions en JavaScript. Des noms clairs et descriptifs améliorent la lisibilité du code, facilitent la maintenance et réduisent les erreurs.

Pourquoi les noms sont importants#

Un bon nom de variable ou de fonction est comme un commentaire intégré. Il explique immédiatement ce que fait le code sans avoir à le lire en détail. Par exemple :

// Mauvais
const d = 2023;
const t = 12;

// Bon
const currentYear = 2023;
const month = 12;

Principes de base#

1. Utilisez des noms descriptifs#

Évitez les abréviations non standard. Privilégiez la clarté sur la concision.

// Mauvais
const usr = "Alice";
const cnt = 10;

// Bon
const userName = "Alice";
const itemCount = 10;

2. Suivez la convention de nommage#

Utilisez camelCase pour les variables et fonctions, PascalCase pour les classes, et UPPER_CASE pour les constantes.

// Bon
const userName = "Bob";
function calculateTotal() { ... }
class User {
  // ...
}
const MAX_USERS = 100;

3. Évitez les noms ambigus#

Ne nommez pas une variable data ou info si elle contient quelque chose de spécifique.

// Mauvais
const data = getUserData();

// Bon
const userData = getUserData();

4. Soyez cohérent#

Utilisez le même style de nommage à travers tout le projet.

// Mauvais – mélange de styles
const user_name = "Alice";
const userName = "Bob";
const user-name = "Charlie";

// Bon – cohérent
const userName = "Alice";
const userAge = "Bob";
const userCity = "Charlie";

Noms de fonctions#

Les noms de fonctions doivent décrire l’action qu’elles effectuent.

// Bon
function getUserById(id) {
  // ...
}

function calculateTotalPrice(items) {
  // ...
}

function isUserLoggedIn() {
  // ...
}

Évitez les noms comme doSomething, handleEvent, ou processData qui sont trop vagues.

Noms de variables#

Les noms de variables doivent refléter le contenu, pas le type.

// Mauvais
const strName = "Alice";
const intAge = 25;

// Bon
const name = "Alice";
const age = 25;

Noms de classes#

Les noms de classes doivent être des noms de choses concrètes.

// Bon
class User {
  // ...
}

class Order {
  // ...
}

class Product {
  // ...
}

Noms de constantes#

Les constantes doivent être claires et explicites.

// Bon
const MAX_LOGIN_ATTEMPTS = 5;
const DEFAULT_TIMEOUT = 3000;

Bonus : Noms de variables booléennes#

Pour les variables booléennes, utilisez des verbes ou des expressions qui indiquent un état.

// Bon
const isLoggedIn = true;
const hasPermission = false;
const isReady = true;

Conclusion#

Des noms de variables et de fonctions bien choisis améliorent considérablement la qualité du code. Ils rendent le code plus lisible, plus maintenable et plus robuste. Prenez le temps de bien nommer vos éléments — cela paie largement à long terme.

Pour en savoir plus, consultez JavaScript Style Guide ou contactez-nous à hello@codemaster.dev.