1. Pollution mondiale de l'espace de noms
Enveloppez toujours le code dans une expression de fonction immédiate pour former un module indépendant.
Pas recommandé
var x = 10, y = 100; console.log (fenêtre.x + '' + fenêtre.y);
recommander
; (fonction (fenêtre) {'utiliser strict'; var x = 10, y = 100; console.log (window.x + '' + window.y);} (fenêtre));2. Exécutez la fonction immédiatement
Dans la fonction d'exécution immédiate, si des variables globales sont utilisées, le corps de fonction qui exécute immédiatement la fonction peut être appelé sous la forme de variables locales lorsqu'elle est appelée, ce qui améliore les performances du programme dans une certaine mesure.
Et vous devez ajouter undefined aux paramètres formels de la fonction, à la dernière position, car undefined dans ES3 peut être lu et écrit. Si la valeur des undefined est modifiée dans la position globale, votre code peut ne pas obtenir de résultats en retard.
De plus, il est recommandé d'ajouter immédiatement des demi-colons au début et à la fin de la fonction pour éviter d'affecter notre propre code en raison du code irrégulier des autres lors de la fusion.
Pas recommandé
(fonction () {'utiliser strict'; var x = 10, y = 100, c, elem = $ ('body'); console.log (window.x + '' + window.y); $ (document) .on ('cliquez', fonction () {}); if (typeof c === 'Undefined') {// votre code}} ());recommander
; (fonction ($, fenêtre, document, indéfini) {'utiliser strict'; var x = 10, y = 100, c, elem = $ ('body'); console.log (window.x + '' + window.y); $ (document) .on ('click', function () {}); if (typeof c == '' Undefined ') {// votre code}} (jQuery);3. Mode strict
Le mode strict ECMAScript 5 peut être activé dans tout le script ou dans une seule méthode. Il correspond à différents contextes JavaScript et effectuera des vérifications d'erreur plus strictes. Le mode strict garantit également que le code JavaScript est plus robuste et fonctionne plus rapidement.
Le mode strict empêche l'utilisation de mots clés réservés susceptibles d'être introduits à l'avenir.
Vous devez activer le mode strict dans votre script, de préférence l'appliquer dans une fonction d'exécution immédiate autonome. Évitez de l'utiliser sur la première ligne de votre script qui fait démarrer le mode strict de tous vos scripts, ce qui peut causer des problèmes avec une bibliothèque tierce.
Pas recommandé
'utiliser strict'; (function () {} ());recommander
(function () {'utiliser strict';} ());Iv. Déclaration variable
Pour toutes les déclarations variables, nous devons spécifier var . Si var n'est pas spécifiée, une erreur sera rapportée en mode strict et les variables dans la même portée doivent être déclarées avec un var autant que possible, et plusieurs variables doivent être séparées par "", ".
Pas recommandé
fonction myfun () {x = 5; y = 10;}Pas entièrement recommandé
fonction myfun () {var x = 5; var y = 10;}recommander
fonction myfun () {var x = 5, y = 10;}5. jugement comparatif en utilisant le jugement de type
Il utilise l'opérateur de comparaison exact === pour éviter les problèmes causés par la distribution de JavaScript pendant le processus de jugement.
Si vous utilisez l'opérateur ===, les deux parties à la comparaison doivent être du même type pour être valide.
Pas recommandé
(fonction (w) {'utiliser strict'; w.console.log ('0' == 0); // true w.console.log ('' == false); // true w.console.log ('1' == true); // true w.console.log (null ==}; w.console.log (x == 'x'); // true} (window.console.log));recommander
(fonction (w) {'utiliser strict'; w.console.log ('0' === 0); // false w.console.log ('' === false); // false w.console.log ('1' === true); // false w.console.log (null === }; w.console.log (x === 'x'); // false} (fenêtre));6. Opérations logiques lors de l'affectation variable
Opérateurs logiques || et && peuvent également être utilisés pour retourner les valeurs booléennes. Si l'objet d'opération est un objet non boléen, chaque expression sera jugée de gauche à droite. Sur la base de cette opération, il y a toujours une expression qui est renvoyée à la fin. Cela peut être utilisé pour simplifier votre code lors de l'attribution de variables.
Pas recommandé
if (! x) {if (! y) {x = 1; } else {x = y; }}recommander
x = x || y || 1;
7. Semi-colon
Utilisez toujours des demi-colons car la nidification de code implicite peut causer des problèmes indétectables. Bien sûr, nous devons éliminer fondamentalement ces problèmes [1].
Les exemples suivants montrent le mal de manquer un point-virgule:
// 1.Myclass.prototype.myMethod = function () {return 42;} // il n'y a pas de semi-semi-sotation ici (fonction () {}) (); //2.var x = {'i': 1, 'J': 2} // Il n'y a pas de demi-virage ici // Je sais que vous pourriez jamais écrire un tel code, mais je donnerai un exemple [ffversion, ieversion] [ISIE] (); // 3.Var Things_to_eat = [pommes, huîtres, SprayOnCheese] // Il n'y a pas de semicolon ici-1 == resultOfoperation () || mourir();Résultats d'erreur
1. Erreur JavaScript - La fonction qui renvoie 42 est appelée d'abord par le paramètre dans la deuxième fonction, puis le numéro 42 est également "appelé", résultant en une erreur.
2. Quatre-vingt fois, vous obtiendrez le message d'erreur de «aucune propriété de ce type indéfinie», car l'appel dans l'environnement réel ressemble à ceci: xffversion, ieversion ().
3.Die est toujours appelée. Parce que le résultat de moins 1 dans le tableau est NAN, il n'égmente rien (que le résultat renvoie NAN ou non). Ainsi, le résultat final est que la valeur obtenue après DIE () est exécutée sera attribuée à Things_To_Eat.
8. Déclaration de fonction dans les blocs d'instructions
Ne déclarez jamais les fonctions dans les blocs d'instructions, ce qui est illégal en mode strict d'ECMAScript 5. Les déclarations de fonction devraient être au niveau supérieur de portée. Cependant, dans le bloc d'instructions, la déclaration de fonction peut être convertie en une expression de fonction et attribuée à une variable.
Pas recommandé
if (x) {fonction foo () {}}recommander
if (x) {var foo = function () {};}9. N'utilisez pas la fonction EVAL
eval() confond non seulement le contexte mais aussi dangereux. Il y aura toujours une autre solution pour écrire votre code qui est meilleur, plus clair et plus sûr que cela, alors essayez de ne pas utiliser la fonction eval .
10. Literales du tableau et des objets
1. Utilisez des littéraux du tableau et des objets au lieu du tableau du tableau et du constructeur d'objets. Les constructeurs de tableaux peuvent facilement faire des erreurs sur ses paramètres.
Pas recommandé
// Longueur du tableau 3var a1 = nouveau tableau (x1, x2, x3); // longueur de tableau 2var a2 = nouveau tableau (x1, x2); // Si x1 est un nombre naturel, sa longueur sera x1 // si x1 n'est pas un nombre naturel, sa longueur sera 1Var A3 = nouveau tableau (x1); var a4 = new Array (););
Pour cette raison, si le code passe de deux à un, il y a une forte possibilité que le tableau subira des changements de longueur inattendus. Pour éviter de telles situations étranges, utilisez toujours des littéraux lisibles de tableau.
recommander
var a = [x1, x2, x3]; var a2 = [x1, x2]; var a3 = [x1]; var a4 = [];
2. Le constructeur d'objets n'aura pas de problèmes similaires, mais pour la lisibilité et l'uniformité, nous devons utiliser des littéraux d'objets.
Pas recommandé
var o = nouvel objet (); var o2 = nouvel objet (); o2.a = 0; o2.b = 1; o2.c = 2; o2 ['clé étrange'] = 3;
recommander
var o = {}; var o2 = {a: 0, b: 1, C: 2, 'Strange Key': 3};11. Jugement en condition à triple variable (méthode rapide pour If)
Utilisez l'opérateur ternaire pour attribuer ou retourner les instructions. Utilisez dans des situations relativement simples et évitez d'utiliser dans des situations complexes. Personne ne veut utiliser 10 lignes d'opérateurs ternaires pour se déplacer.
Pas recommandé
if (x === 10) {return 'valide';} else {return 'invalid';}recommander
retour x === 10? «valide»: «invalide»;
12. Pour Loop
Au cours du processus d'utilisation pour la boucle, la durée du tableau est reçue par une variable, qui est propice à l'amélioration de l'efficacité d'exécution du code. Au lieu de cela, la longueur du tableau doit être recalculée chaque fois que la boucle a disparu.
Pas recommandé
for (var i = 0; i <arr.length, i ++) {}recommander
pour (var i = 0, len = arr.length; i <len, i ++) {}13. Opérations DOM répétées
Opérations DOM répétées, il est nécessaire d'utiliser une variable à recevoir, plutôt que d'exploiter fréquemment l'arbre DOM, ce qui a un mauvais impact sur les performances, le code bien rangé et la maintenance facile.
Pas recommandé
$ ('. mydiv'). find ('. span1'). text ('1'); $ ('. mydiv'). find ('. span2'). text ('2'); $ ('. mydiv'). find ('. span3'). text ('3'); ".".recommander
var myDiv = $ ('. MyDiv'); mydiv.find ('. span1'). text ('1'); mydiv.find ('. span2'). text ('2'); mydiv.find ('. span3'). text ('3'); mydiv.find ('. span4'). text ('4'); Lorsque jquery .end() est disponible, utiliser .end() doit être préféré.
recommander
$ ('. MyDiv'). trouver ('. span1'). text ('1') .end (). find ('. span2'). text ('2'); .end (). find ('. span3'). text ('3'); .end (). find ('. span4'). text ('4');14. Spécifications de commentaire
Lorsque vous décrivez les commentaires, un style de commentaire formaté et unifié est recommandé. Essayez de décrire les idées lorsque vous écrivez des commentaires, plutôt que ce que fait le code.
Pas recommandé
// Obtenez la fonction de commande getOrderById (id) {var ordre; // ... Ordre de retour;}Les annotations de méthode doivent être uniformément utilisées avec des annotations au niveau des blocs
recommander
/ ** * Obtenez les données détaillées de l'ordre basées sur ID de commande * @param {[numéro]} id [ID de commande] * @return {[Ordre]} [Détails de l'ordre] * / fonction getOrderById (id) {var ordre; // ... Ordre de retour;}Résumer
Le résumé des spécifications de rédaction de code communs de JavaScript est essentiellement terminée. Cet article est toujours très complet et a une certaine valeur de référence pour que tout le monde puisse utiliser ou apprendre un javascript. J'espère que ce sera utile à tout le monde. Si vous avez des questions, vous pouvez laisser un message pour communiquer.