Maison  >  Article  >  interface Web  >  Introduction détaillée au guide de style de codage JavaScript

Introduction détaillée au guide de style de codage JavaScript

黄舟
黄舟original
2017-03-13 16:52:121494parcourir

1. Format de base

Indentation

Il est recommandé d'avoir 4 espaces par niveau. Vous pouvez définir tab = 4 espaces pour l'éditeur<.> , convertit automatiquement les

points-virgules

Ne pas omettre les points-virgules pour éviter les erreurs ASI (insertion automatique de point-virgule)

largeur de ligne

Chaque ligne de code ne doit pas dépasser 80 caractères. Si elle est trop longue, vous devez utiliser l'opérateur pour couper manuellement la ligne

Saut de ligne.

L'opérateur est à la fin de la ligne précédente. Et la ligne suivante est en retrait de 2 niveaux. S'il s'agit d'une instruction d'affectation, elle doit également être alignée avec la partie après le signe égal

ligne vierge

fonction

la déclaration et les déclarations de fonction, les déclarations de variables, les déclarations de fonction et les blocs logiques au sein des fonctions doivent tous être séparés par des lignes videsL'auteur Nicholas recommande également de laisser une ligne vide en haut du bloc

flow control

, mais l'exemple donné n'est pas très clair

Naming

  • Nom de la variable

    /Nom de la fonction : Règle du chameau (cas du chameau), premier La première lettre du mot est en minuscule, la première lettre des mots suivants est en majuscule et le reste est en minuscule

  • Constante

    Nom :Langage C formule, toutes majuscules, segmentation des mots soulignés

  • Constructeur

     : règle de Pascal, toutes les premières lettres sont en majuscules, les autres sont en minuscules

Littéral

  • Chaîne

     : entourée de guillemets doubles, utilisez l'opérateur [ ] pour les sauts de ligne, n'utilisez pas de caractères d'échappement

  • Valeur numérique : n'omettez pas la partie avant et après le point décimal, n'utilisez pas la forme octale
  • Null

     : traitez uniquement null comme un espace réservé pour le symbole Objet, ne l'utilisez pas pour détecter paramètres formels, ni l'utiliser pour détecter des variables non initialisées

  • Non défini : tous les
  • objets

    doivent être initialisés à null pour distinguer les variables non initialisées

    Littéral d'objet/littéral de tableau : Ne pas déclarer d'objets et de tableaux en mode constructeur
  • 2.
  • Notes

P.S. Il y a une explication très classique dans le livre :

Des commentaires correctement écrits aident à raconter l'histoire du code,

tout
obligeant d'autres développeurs à se lancer dans une partie de l'histoire sans avoir besoin de le faire. entendre le début.

Commentaires sur une seule ligne

Fin de ligne : utilisez l'indentation de niveau 1 pour séparer le code, et il doit y avoir un espace après //
  • sur sa propre ligne : permet de commenter en dessous, garder le même retrait que le code commenté
  • Tête de ligne : utilisé pour commenter plusieurs lignes de code
  • Commentaires multilignes

utilisé pour envelopper des commentaires volumineux, recommandé Eclipse

style, tel que

Remarque :
/*
 * comment line1
 * comment line2
 */

Laissez une ligne vide au-dessus des commentaires multilignes
  • * Laissez un espace après l'astérisque
  • Les commentaires sur plusieurs lignes doivent comporter au moins trois lignes (car il n'y a pas de commentaires après la première et la dernière ligne)
  • Où ajouter des commentaires

Code qui n'est pas explicite
  • Intentionnel , mais il semble que quelque chose ne va pas
  • Piratage du navigateur
  • Commentaires de la documentation

Les commentaires devraient être ajouté à chaque fonction, y compris la description de la fonction, les paramètres, les valeurs de retour, les erreurs générées, etc., comme le style Eclipse recommandé :

Instructions et expressions

/**
 * 添加指定元素到默认数组
 *
 * @method add
 * @param {Number} 将要添加的元素
 * @return {Boolean} 添加成功/失败
 * @throw {TypeError} 参数类型不匹配
 */
function add(item){
    if(typeof item === "number"){
        arr.push(item)
    }
    else{
        throw new TypeError();
    }
}

Alignement des accolades

Le style de fin de ligne est recommandé, le style de sous-ligne n'est pas recommandé

Bloquer les espaces d'instruction

Là est un espace avant et après les parenthèses après if, par exemple :

if (expr) {
    code
}
instruction switch

contraction Avance : aligner la casse et le commutateur,
    pause
  • Niveau de retrait 1

    Case through : utilisez une ligne vide ou un commentaire // passe à travers pour indiquer que la casse est intentionnelle
  • default : Conserver la valeur par défaut ou commenter //no default pour indiquer qu'il n'y a pas de valeur par défaut
  • P.S. Auteur de "
  • JavaScript
Language Essence" Douglas estime que la pénétration des cas ne devrait pas être utilisée (appelée inutile), car elle est facile à provoquer des bugs, tandis que Nicholas pense qu'il est préférable d'utiliser des lignes vides ou des commentaires

avec déclaration

Pas besoin

pour la boucle

Toutes les variables doivent être déclarées en haut du corps de la fonction, y compris les variables utilisées dans la partie initialisation de la boucle for, pour éviter les bugs causés par l'hébergement (promotion) (les variables globales peuvent être bloquées)

La boucle for-in

ne doit pas être utilisée pour parcourir le tableau Lorsque vous l'utilisez, n'oubliez pas d'ajouter le filtrage hasOwnProperty Si vous parcourez délibérément le prototype . propriété , vous devez utiliser un commentaire pour expliquer

4 Variables, fonctions, opérateurs

Déclaration de variable

Corps de fonction = déclaration de variable déclaration logique de déclaration de fonction. Séparez chaque partie par des lignes vides

Déclaration de fonction

Déclarez avant utilisation. Ne mettez jamais de déclaration de fonction dans la branche if, car les navigateurs la comprennent différemment. un appel de fonction

standard

sans ajouter d'espaces avant et après les parenthèses pour éviter toute confusion avec les instructions de bloc

Fonction anonyme Exécuter immédiatement

Enveloppez la fonction anonyme qui est exécutée immédiatement entre parenthèses pour éviter toute confusion avec la déclaration de fonction anonyme

Mode strict

N'activez pas le mode strict dans la portée globale, activez-le uniquement dans la fonction. Si vous activez plusieurs fonctions, vous pouvez utiliser des fonctions anonymes pour exécuter immédiatement la portée du mode strict

Le jugement est égal. à

Utilisez uniquement === et !==

eval

Ne pas utiliser eval() et new Function(), utilisez la fonction anonyme pour optimiser setTimeout() et setInterval()

Type d'emballage de base

Ne pas utiliser new Boolean(), new String(), new Number()


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