Maison  >  Article  >  interface Web  >  Meilleures pratiques pour écrire du code JavaScript propre et maintenable

Meilleures pratiques pour écrire du code JavaScript propre et maintenable

Susan Sarandon
Susan Sarandonoriginal
2024-10-22 16:38:02759parcourir

Best Practices for Writing Clean and Maintainable JavaScript Code

1. Noms de variables et de fonctions significatifs :
Astuce : utilisez des noms descriptifs qui indiquent clairement le but de la variable ou de la fonction.
Exemple :

Copy code
// Bad
const x = calculate(5);

// Good
const totalPrice = calculatePrice(5);

2. Commentaires descriptifs :
Astuce : rédigez des commentaires concis mais significatifs pour expliquer une logique ou une intention complexe. Les commentaires doivent clarifier pourquoi quelque chose est fait, et non ce qui est fait (ce qui devrait être clair dans le code lui-même).
Exemple :

// Bad
// Loops through the array
array.forEach(item => doSomething(item));

// Good
// Process each item to filter out non-active users
array.forEach(item => filterActiveUsers(item));

3. Principe de responsabilité unique :
Astuce : Assurez-vous que les fonctions et les méthodes effectuent une tâche spécifique, ce qui les rend réutilisables et faciles à déboguer.
Exemple :

// Bad
function handleUserLoginAndDisplayUserProfile() { /* multiple tasks */ }

// Good
function handleUserLogin() { /* one task */ }
function displayUserProfile() { /* one task */ }

4. Formatage et style cohérents :
Astuce : utilisez un formatage de code cohérent (indentation, espaces) et suivez les directives de style (camelCase pour les variables, PascalCase pour les classes, etc.).
Exemple :

js
Copy code
// Bad
function fetchData(){return 'data'}

// Good
function fetchData() {
  return 'data';
}

5. Évitez les nombres et les chaînes magiques :
Astuce : utilisez des constantes nommées au lieu de nombres ou de chaînes codés en dur, ce qui rend votre code plus lisible et maintenable.
Exemple :

// Bad
const discount = total * 0.1;

// Good
const DISCOUNT_RATE = 0.1;
const discount = total * DISCOUNT_RATE;

6. Écrire du code modulaire :
Astuce : Décomposez votre code en modules ou fonctions plus petits et réutilisables. Cela augmente la réutilisabilité et la maintenabilité.
Exemple :

// Bad
function processOrder(order) { /* many tasks */ }

// Good
function validateOrder(order) { /* one task */ }
function calculateTotal(order) { /* one task */ }

7. Utilisez une gestion significative des erreurs :
Astuce : Détectez et gérez correctement les erreurs, en donnant des commentaires significatifs aux développeurs ou aux utilisateurs.
Exemple :

// Bad
try {
  processOrder(order);
} catch (e) {
  console.log(e);
}

// Good
try {
  processOrder(order);
} catch (error) {
  console.error(`Failed to process order: ${error.message}`);
}

8. Principe SEC (Ne vous répétez pas) :
Astuce : évitez de dupliquer le code en refactorisant la logique commune en fonctions ou en modules.
Exemple :

// Bad
const userAge = getUserAge();
const userName = getUserName();

// Good
function getUserDetails() {
  return {
    age: getUserAge(),
    name: getUserName(),
  };
}

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn