Ici on vous dévoile plusieurs astuces pour vous aider à coder proprement en JavaScript. Le codage propre signifie que vous écrivez du code pour vous-même et vos collègues et non pour la machine. Votre code doit être facilement compréhensible pour les humains.
Voici quelques-unes des pratiques de codage propre que je suis lorsque j’écris du code JavaScript. Ces pratiques ne sont pas spécifiques à un language ou framework et peuvent être utilisées avec n’importe quel language ou framework.
1. Écrire un code simple
Le code doit être suffisamment simple pour être compris. Par exemple, si nous devons écrire une méthode qui prend un tableau de nombres et retourne le nouveau tableau avec chaque nombre dans le tableau double sa valeur. Ceci peut être implémenté comme suit.
2. Meilleur nommage des variables et des méthodes
Cela améliore la lisibilité du code et le code devient plus facile à maintenir. Les noms doivent être significatifs et avoir un contexte. En lisant le nom d’une fonction ou d’une variable, on doit comprendre son but.
3. Écrire du code linéaire
Le code imbriqué est difficile à comprendre. Écrivez toujours le code linéaire autant que possible. Cela rend notre code simple, propre, facile à lire et facile à maintenir, ce qui facilite la vie du développeur.
Par exemple, écrivons une fonction qui envoie un email au propriétaire du problème.
4. Utiliser ESLint, Prettier et les dernières versions de JavaScript
Utilisez toujours ESLint et Prettier pour créer un style de codage commun à tous les développeurs, trouver les erreurs de syntaxe et le formatage du code. Utilisez les dernières fonctionnalités de JavaScript pour écrire du code, comme la déstructuration, l’opérateur d’étalement, l’async-await, les littéraux de template, le chaînage optionnel et plus encore.
5. Les fonctions doivent faire une seule chose
La fonction ne doit pas dépasser 20-25 lignes. Plus la fonction est petite, mieux c’est. La fonction doit soit modifier, soit interroger quelque chose, mais pas les deux. Considérez le code suivant.
6. Les Arrays
Elles contiennent généralement une liste d’éléments ; par conséquent, ajoutez un s à votre nom de variable. Par exemple :
const voitures = ['audi', 'bmw', 'mercedes', 'tesla']7. Booléens
Commencez simplement par est ou doit être proche du langage naturel. Vous demanderiez quelque chose comme : » Cette personne est-elle un enseignant ? « . → « Oui » ou « Non ». De même :
const estMajeur = true // OR false8. Isolez votre code
La chose la plus importante que je puisse recommander pour garder une base de code propre et lisible est d’avoir des morceaux spécifiques de logique (généralement des fonctions) séparés par thème. Si vous écrivez une fonction, celle-ci doit avoir par défaut un seul objectif et ne doit pas faire plusieurs choses à la fois.
En outre, vous devez éviter de provoquer des effets secondaires, ce qui signifie que, dans la plupart des cas, vous ne devez pas modifier ce qui est déclaré en dehors de votre fonction. Vous recevez des données dans les fonctions avec des paramètres ; tout le reste ne doit pas être accessible. Si vous souhaitez obtenir quelque chose de la fonction, renvoyez de nouvelles valeurs.
9. Modularisation
Bien entendu, vous pouvez regrouper plusieurs fonctions dans un module (et/ou une classe, si vous le souhaitez) si ces fonctions sont utilisées de manière similaire ou font des choses similaires. Par exemple, si vous avez de nombreux calculs différents à effectuer, divisez-les en étapes isolées (fonctions) que vous pouvez enchaîner. Toutefois, ces fonctions peuvent toutes être déclarées dans un seul fichier (module).
Si vous écrivez du JavaScript frontal, utilisez absolument les exportations par défaut pour les éléments les plus importants et les exportations nommées pour les éléments secondaires.