JavaScript no tiene una guía de estilo de codificación autorizada, sino que son algunos estilos de codificación populares:
La copia del código es la siguiente:
Guía de estilo JavaScript de Google (en adelante, denominado Google)
http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml
Estilo de codificación de NPM (en adelante, denominado NPM)
https://npmjs.org/doc/coding-style.html
Guía de estilo Node.js de Felix (en lo sucesivo denominado node.js)
http://nodeguide.com/style.html
JavaScript idiomático (en adelante, denominado idiomático)
https://github.com/rwldrn/iiomatic.js/
Guía de estilo JQuery JavaScript (en adelante, denominada jQuery)
http://contribute.jquery.org/style-guide/js/
La Guía de estilo JavaScript de Douglas Crockford (en adelante, denominada Crockford), Douglas Crockford es una de las autoridades técnicas más conocidas en el campo del desarrollo web y miembro del comité de estandarización de ECMA JavaScript 2.0
http://javascript.crockford.com/code.html
Por supuesto, también hay algunas opciones de configuración predeterminadas en JavaScript Syntax Checkers Jslint y Jshint. La pregunta es, ¿cuál es el mejor estilo de codificación de JavaScript que la mayoría de los desarrolladores pueden seguir? Encontremos algunos estilos de consenso de estas 6 guías de estilo a continuación.
1. Comparación de estilo de código
1.1 sangría
Dos espacios, ya no sangración, sin muescas de pestaña: Google, NPM, Node.js, Idiomatic
Pestaña sangría: jQuery
4 espacios: Crockford
1.2 espacios entre parámetros y expresiones
Use estilos compactos: Google, NPM, Node.js
Copie el código de la siguiente manera: Project.myClass = function (arg1, arg2) {
Demasiado uso de espacios: idiomático, jQuery
Copie el código de la siguiente manera: para (i = 0; i <longitud; i ++) {
Sin comentarios: Crockford
En la mayoría de las guías, se recuerda a los desarrolladores que no tengan espacios al final de una declaración.
1.3 Longitud de línea de código
Hasta 80 caracteres: Google, NPM, Node.js, Crockford (cuando en un bloque de código, otros huertos, excepto 2 espacios, permiten que los parámetros de la función se alineen con la posición del primer parámetro de función. Otra opción es usar 4 espacios para envolver la línea en lugar de 2.)
Sin comentarios: jQuery, idiomático
1.4 Semicolon
Siempre use semicolones, no confíe en insertos implícitos: Google, Node.js, Crockford
No use esperar: NPM en algunos casos
Sin comentarios: jQuery, idiomático
1.5 comentarios
Siga las convenciones de JSDOC: Google, Idiomatic
Sin comentarios: NPM, Node.js, JQuery, Crockford
1.6 citas
Citas individuales recomendadas: Google, Node.js
Citas dobles: jQuery
Sin comentarios: NPM, Idiomatic, Crockford
1.7 Declaración variable
Declare uno a la vez sin usar comas: node.js
La copia del código es la siguiente:
var foo = ";
var bar = ";
Declarar múltiples a la vez, use comas para separarse al final de la línea: idiomático, jQuery
La copia del código es la siguiente:
var foo = "",
bar = "",
quux;
Use coma al comienzo de la línea: NPM
Sin comentarios: Google, Crockford
1.8 aparatos ortopédicos
Use los aparatos ortopédicos de apertura en la misma línea: Google, NPM, Node.js, Idiomatic, JQuery, Crockford
Copie el código de la siguiente manera: function thisIsBlock () {
La guía de NPM establece que solo usan aparatos ortopédicos cuando el bloque de código debe incluir la siguiente línea, de lo contrario no se utilizará.
1.9 Variables globales
No use variables globales: Google, Crockford (Google dice que los conflictos de nomenclatura de variables globales son difíciles de depurar, y pueden tener algunos problemas difíciles cuando se integran dos proyectos. Para facilitar el intercambio del código de JavaScript común, se deben hacer convenciones para evitar conflictos. Crockford cree que no se deben utilizar variables globales implícitas.
Sin comentarios: Idiomático, jQuery, npm, node.js
2 estilo de nombramiento
2.1 Naming de variable
La primera palabra al principio es en minúsculas, y la primera letra de todas las palabras después es el mayúscula: Google, NPM, Node.js, Idiomático
La copia del código es la siguiente:
var foo = "";
var fooname = "";
2.2 Namas constantes
Use letras mayúsculas: Google, NPM, Node.js
La copia del código es la siguiente: var contrario = 'valor';
Sin comentarios: jQuery, Idiomatic, Crockford
2.3 Naming de funciones
La primera palabra al principio es minúsculas, y la primera letra de todas las palabras después es el mayúscula (camello): Google, NPM, Idiomático, node.js (se recomienda usar nombres de funciones largos y descriptivos)
La copia del código es la siguiente:
Función Muy LongoperationName
función Short () ..
Nombramiento de la función en forma de palabra clave:
La copia del código es la siguiente:
función iSready ()
función setName ()
función getName ()
Sin comentarios: jQuery, Crockford
2.4 nombres de matriz
Utilice la forma plural: idiomática
La copia del código es la siguiente: Documentos var = [];
Sin comentarios: Google, JQuery, NPM, Node.js, Crockford
2.5 Nombres de objeto y clase
Use los siguientes formularios: Google, NPM, Node.js
La copia del código es la siguiente:
var thisIsObject = nueva fecha;
Sin comentarios: jQuery, Idiomatic, Crockford
2.6 Otros nombres
Use el caso All-Lower-Hyphen-CSS para nombres de archivos largos y claves de configuración: NPM
3. Configure el archivo .jshintrc de acuerdo con el estilo anterior
Jshint (http://www.jshint.com/) es una herramienta de verificación de estilo JavaScript que puede usar para recordar los problemas relacionados con el estilo de código. Puede estar bien integrado en muchos editores de uso común y es una gran herramienta para unificar los estilos de codificación de equipo.
Puede ver las opciones disponibles a través de la documentación de Jshint: http://www.jshint.com/docs/#options
Lo siguiente es crear un archivo .jshintrc basado en el primer estilo en cada una de las categorías anteriores. Puede ponerlo en el directorio raíz del proyecto, y el editor de código JSHINT-AVARE unificará todos los estilos de código en el proyecto según él.
La copia del código es la siguiente:
{
"Camelcase": Verdadero,
"sangría": 2,
"Undef": Verdadero,
"CITURA DE CITA": Single,
"Maxlen": 80,
"Derribo": Verdadero,
"rizado": verdadero
}
Además, debe agregar el siguiente encabezado a su archivo JavaScript:
La copia del código es la siguiente:
/ * Jshint Browser: True, jQuery: True */
En el archivo node.js debe agregar:
La copia del código es la siguiente:
/ *nodo jshint: verdadero */
También puede agregar la siguiente declaración en varios archivos JavaScript:
La copia del código es la siguiente:
'Use estricto';
Esto afectará a Jshint y su motor JavaScript y puede no ser tan compatible, pero JavaScript se ejecutará más rápido.
4. Ejecutar automáticamente jshint antes de cometer git
Si desea asegurarse de que todo el código JS sea consistente con el estilo definido en .jshintrc, puede agregar lo siguiente a su archivo .git/gooks/pre-Commit, y la verificación de estilo se realizará automáticamente cuando intente enviar cualquier archivo recién modificado al proyecto.
La copia del código es la siguiente:
#!/bin/bash
# El git de git pre-Commit para ejecutar Jshint en archivos JavaScript.
#
# Si absolutamente debe comprometerse sin pruebas,
# Uso: Git Commit--No-Verify
FileNames = ($ (Git Diff-Cachado-Cabezal-Nombre)))
que jshint &> /dev /null
si [$? -ne 0];
Entonces
Echo "Error: Jshint no encontrado"
echo "Instalar con: Sudo NPM Install -g Jshint"
Salir 1
FI
para i en "$ {nombre de archivo [@]}"
hacer
if [[$ i = ~ /.js$]];
Entonces
Echo jshint $ i
Jshint $ I
si [$? -ne 0];
Entonces
Salir 1
FI
FI
hecho