Meilleures pratiques JavaScript
Évitez les variables globales, évitez newéviter ==éviter eval()
Évitez les variables globales
Minimisez l’utilisation des variables globales.
Cela inclut tous les types de données, objets et fonctions.
Les variables et fonctions globales peuvent être écrasées par d’autres scripts.
Utilisez plutôt des variables locales et apprenez à utiliser les fermetures.
Toujours déclarer les variables locales
Toutes les variables utilisées dans une fonction doivent être déclarées comme local variables.
Variables locales devoir être déclaré avec le varle letou la const mot-clé, sinon elles deviendront des variables globales.
Le mode strict n’autorise pas les variables non déclarées.
Déclarations en haut
C’est une bonne pratique de codage de placer toutes les déclarations en haut de chaque script ou fonction.
Cette volonté:
- Donner un code plus propre
- Fournir un emplacement unique pour rechercher les variables locales
- Faciliter l’évitement des variables globales indésirables (implicites)
- Réduisez la possibilité de redéclarations non désirées
// Déclarer au début
let firstName, lastName, price, discount, fullPrice ;
// Utiliser plus tard
prenom = “Jean” ;
nom de famille = “Biche” ;
prix = 19,90 ;
remise = 0,10 ;
fullPrice = prix – remise ;
Cela vaut également pour les variables de boucle :
pour (soit i = 0; i < 5; i++) {
Initialiser les variables
C’est une bonne pratique de codage d’initialiser les variables lorsque vous les déclarez.
Cette volonté:
- Donner un code plus propre
- Fournir un emplacement unique pour initialiser les variables
- Éviter les valeurs indéfinies
// Déclarer et initier au début
let firstName = “” ;
let lastName = “” ;
soit prix = 0 ;
soit escompte = 0 ;
laisser fullPrice = 0,
const monTableau = [];
const monObjet = {} ;
L’initialisation des variables donne une idée de l’utilisation prévue (et du type de données prévu).
Déclarer des objets avec constante
Déclarer des objets avec const empêchera tout changement accidentel de type :
Exemple
let car = {type:”Fiat”, model:”500″, color:”white”} ;
voiture = “Fiat” ; // Change l’objet en chaîne
const car = {type:”Fiat”, model:”500″, color:”white”} ;
voiture = “Fiat” ; // Pas possible
Déclarer des tableaux avec constante
Déclarer des tableaux avec const empêchera tout changement accidentel de type :
Exemple
laissez les voitures = [“Saab”, “Volvo”, “BMW”];
voitures = 3 ; // Change le tableau en nombre
const voitures = [“Saab”, “Volvo”, “BMW”];
voitures = 3 ; // Pas possible
Ne pas utiliser new Object()
- Utiliser
""au lieu denew String() - Utiliser
0au lieu denew Number() - Utiliser
falseau lieu denew Boolean() - Utiliser
{}au lieu denew Object() - Utiliser
[]au lieu denew Array() - Utiliser
/()/au lieu denew RegExp() - Utiliser
function (){}au lieu denew Function()
Exemple
soit x1 = “” ; // nouvelle chaîne primitive
soit x2 = 0 ; // nouveau nombre primitif
soit x3 = faux ; // nouveau booléen primitif
const x4 = {} ; // nouvel objet
constante x5 = []; // nouvel objet tableau
const x6 = /()/; // nouvel objet d’expression régulière
const x7 = fonction(){} ; // nouvel objet fonction
Essayez-le vous-même »
Méfiez-vous des conversions de type automatiques
JavaScript est faiblement typé.
Une variable peut contenir tous les types de données.
Une variable peut changer son type de données :
Exemple
soit x = “Bonjour” ; // typeof x est une chaîne
x = 5 ; // change typeof x en nombre
Essayez-le vous-même »
Attention, les nombres peuvent être accidentellement convertis en chaînes ou NaN (Pas un numéro).
Lors d’opérations mathématiques, JavaScript peut convertir des nombres en chaînes :
Exemple
soit x = 5 + 7 ; // x.valueOf() vaut 12, typeof x est un nombre
soit x = 5 + “7” ; // x.valueOf() vaut 57, typeof x est une chaîne
soit x = “5” + 7 ; // x.valueOf() vaut 57, typeof x est une chaîne
soit x = 5 – 7 ; // x.valueOf() vaut -2, typeof x est un nombre
soit x = 5 – “7” ; // x.valueOf() vaut -2, typeof x est un nombre
soit x = “5” – 7 ; // x.valueOf() vaut -2, typeof x est un nombre
soit x = 5 – “x” ; // x.valueOf() vaut NaN, typeof x est un nombre
Essayez-le vous-même »
Soustraire une chaîne d’une chaîne ne génère pas d’erreur mais renvoie NaN (Pas un nombre):
Utiliser === Comparaison
Le == L’opérateur de comparaison convertit toujours (en types correspondants) avant la comparaison.
Le === l’opérateur force la comparaison des valeurs et du type :
Exemple
0 == “” ; // vrai
1 == “1” ; // vrai
1 == vrai ; // vrai
0 === “” ; // FAUX
1 === “1” ; // FAUX
1 === vrai ; // FAUX
Essayez-le vous-même »
Utiliser les paramètres par défaut
Si une fonction est appelée avec un argument manquant, la valeur de l’argument manquant est définie sur
undefined.
Les valeurs non définies peuvent casser votre code. C’est une bonne habitude d’assigner des valeurs par défaut aux arguments.
Exemple
function maFonction(x, y) {
si (y === indéfini) {
y = 0 ;
}
}
Essayez-le vous-même »
ECMAScript 2015 autorise les paramètres par défaut dans la définition de la fonction :
fonction (a=1, b=1) { /*code fonction*/ }
En savoir plus sur les paramètres de fonction et les arguments sur Paramètres de fonction
Terminez vos commutateurs avec les valeurs par défaut
Terminez toujours votre switch déclarations avec un default. Même si vous pensez que cela n’est pas nécessaire.
Exemple
basculer (nouvelle Date().getDay()) {
cas 0 :
jour = “dimanche” ;
casser;
cas 1:
jour = “lundi” ;
casser;
cas 2 :
jour = “mardi” ;
casser;
cas 3 :
jour = “mercredi” ;
casser;
cas 4 :
jour = “jeudi” ;
casser;
cas 5 :
jour = “vendredi” ;
casser;
cas 6 :
jour = “samedi” ;
casser;
défaut:
jour = “Inconnu” ;
}
Essayez-le vous-même »
Évitez les nombres, les chaînes et les booléens en tant qu’objets
Traitez toujours les nombres, les chaînes ou les booléens comme des valeurs primitives. Pas comme des objets.
Déclarer ces types en tant qu’objets ralentit la vitesse d’exécution et produit des effets secondaires désagréables :
Exemple
soit x = “Jean” ;
soit y = new String(“John”);
(x === y) // est faux car x est une chaîne et y est un objet.
Essayez-le vous-même »
Ou pire encore :
Exemple
soit x = new String(“John”);
soit y = new String(“John”);
(x == y) // est faux car vous ne pouvez pas comparer des objets.
Essayez-le vous-même »
Évitez d’utiliser eval()
Le eval() La fonction est utilisée pour exécuter du texte en tant que code. Dans presque tous les cas, il ne devrait pas être nécessaire de l’utiliser.
Parce qu’il permet l’exécution de code arbitraire, il représente également un problème de sécurité.
#Meilleures #pratiques #JavaScript
