Comment coder avec style ? 😎

Pour bien se retrouver dans son code, il est important de bien nommer les choses. Rapide tour d’horizon de la convention de nommage à adopter pour le Javascript.

Les conventions de nommage

En programmation, on peut retrouver plusieurs conventions de nommage. Voici la listes des plus répandues :

• Le Camel case : les mots sont liés, sans espace. Chaque mot commence par une majuscule, sauf le premier firstName
• Le Pascal case : les mots sont liés, sans espace. Chaque mot commence par une majuscule FirstName
• Le Kebab case (ou Spinal case) : les mots sont en minuscule et liés entre eux par un tiret first-name
• Le Snake case (ou Underscore) : les mots sont en minuscule et liés entre eux par un underscore first_name

💡 En JavaScript, nous n’utiliserons que le Camel case et le Pascal case.

Les variables

Elles sont partout. Logique : on s’en sert constamment. Bien les définir est crucial pour comprendre son code ! 😊

// Bad
let value = "John"
let val = "John"

// Good
let firstName = "John"

À la lecture de votre code, si vous avez du mal à comprendre ce que fait une variable, n’hésitez pas à la renommer.

Pour déclarer une variable on préférera le faire en Camel case :

// Bad : Pascal case
let FirstName = "John"

// Bad : Kebab case
let first-name = "John"

// Bad : Snake case
let first_name = "John"

// Good : Camel case
let firstName = "John"

Les booléens

Pour déclarer des booléens, on ajoute une petite subtilité : un verbe juste devant.

Exemple :

// Bad
let visible = true
let admin = true
let online = true
let run = true

// Good
let isVisible = true
let areAdmin = true
let hasOnline = true
let canRun = true

Les fonctions

Les fonctions utilisent le Camel case et le même patern que les booléens : elles utilisent un verbe.

// Bad
let user() => {
    ...
}

// Good
let getUser() => {
    ...
}

Les classes

Les classes sont déclarées en Pascal case.

Pourquoi… ? Parce qu’elles ont la classe ! 😎

Ou parce que le concept de classe est plus fort qu’une déclaration de variable ! 😉

// Bad
classe userRole {
    ...
    getUser() {
        ...
    }
}

// Good
classe UserRole {
    ...
    getUser() {
        ...
    }
}

💡 Vous avez remarqué ? On déclare les méthodes d’une classe comme les fonctions !

Les constantes

Vous vous souvenez, je vous ai dit qu’en JavaScript on utilisait seulement le Camel case et le Pascal Case ? 🤓

Et bien les constantes sont un peu l’exception à cette règle. Mais rien de bien méchant : les mots sont en majuscules séparés par un underscore.

// Bad
const time = 60
const daysInYear = 365

// Good
const TIME = 60
const DAYS_IN_YEAR

Aller plus loin

Pour aller plus loin, n’hésitez pas à vous rendre sur le lien suivant : https://github.com/GavBaros/clean-code-javascript-fr.

Il s’agit de quelques conseils tirés du livre de Robert C. Martin.