O JavaScript não possui um guia de estilo de codificação autoritário, mas são alguns estilos de codificação populares:
A cópia do código é a seguinte:
Guia de estilo JavaScript do Google (a seguir referido como Google)
http://google-styleguide.googlecode.com/svn/trunk/javascriptGuide.xml
Estilo de codificação NPM (a seguir referido como NPM)
https://npmjs.org/doc/coding-style.html
Guia de estilo Node.js de Felix (a seguir referido como node.js)
http://nodeguide.com/style.html
JavaScript idiomático (a seguir referido como idiomático)
https://github.com/rwldrn/iiomatic.js/
Guia de estilo JQuery JavaScript (a seguir referido como jQuery)
http://contribute.jquery.org/style-guide/js/
Guia de estilo JavaScript de Douglas Crockford (a seguir referido como Crockford), Douglas Crockford é uma das autoridades técnicas mais conhecidas no campo do desenvolvimento da Web e um membro do Comitê de Padronização ECMA JavaScript 2.0
http://javascript.crockford.com/code.html
Obviamente, existem também algumas opções de configurações padrão nos verificadores de sintaxe JavaScript JSLINT e JSHINT. A questão é: qual é o melhor estilo de codificação JavaScript que a maioria dos desenvolvedores pode seguir? Vamos encontrar alguns estilos de consenso desses 6 guias de estilo abaixo.
1. Comparação de estilo de código
1.1 Indentação
Dois espaços, não mais recuo, sem indentação de guias: Google, npm, node.js, idiomático
Tab REDENT: jQuery
4 espaços: Crockford
1.2 Espaços entre parâmetros e expressões
Use estilos compactos: Google, NPM, Node.js
Copie o código da seguinte forma: Project.myclass = function (arg1, arg2) {
Muito uso de espaços: idiomático, jQuery
Copie o código da seguinte forma: para (i = 0; i <comprimento; i ++) {
Sem comentários: Crockford
Na maioria dos guias, os desenvolvedores são lembrados de não ter espaços no final de uma declaração.
1.3 Comprimento da linha de código
Até 80 caracteres: Google, NPM, Node.js, Crockford (quando em um bloco de código, outros recuos, exceto 2 espaços, permitem que os parâmetros da função sejam alinhados com a posição do primeiro parâmetro de função. Outra opção é usar 4 espaços para recuar ao envolver a linha em vez de 2.)
Sem comentários: jQuery, idiomático
1.4 Semi-Colon
Sempre use semicolons, não confiando em inserções implícitas: Google, Node.js, Crockford
Não use espere: npm em alguns casos
Sem comentários: jQuery, idiomático
1.5 comentários
Siga JSDoc Convenções: Google, idiomático
Sem comentários: npm, node.js, jQuery, Crockford
1.6 citações
Citações únicas recomendadas: google, node.js
Citações duplas: jQuery
Sem comentários: NPM, idiomático, Crockford
1.7 Declaração variável
Declare um de cada vez sem usar vírgulas: node.js
A cópia do código é a seguinte:
var foo = ”;
var bar = ”;
Declare vários de uma só vez, use vírgulas para se separar no final da linha: idiomático, jQuery
A cópia do código é a seguinte:
var foo = "",
bar = "",
Quux;
Use vírgula no início da linha: npm
Sem comentários: Google, Crockford
1.8 aparelhos
Use os aparelhos de abertura na mesma linha: Google, NPM, Node.js, Idiomatic, JQuery, Crockford
Copie o código da seguinte forma: função thisisBlock () {
O guia NPM afirma que apenas usa aparelhos quando o bloco de código precisar incluir a próxima linha, caso contrário, não será usada.
1.9 Variáveis globais
Não use variáveis globais: Google, Crockford (o Google diz que os conflitos de nomeação de variáveis globais são difíceis de depurar e podem ter alguns problemas complicados quando dois projetos estão sendo integrados. Para facilitar o compartilhamento de código JavaScript comum, não devem ser usados convenções para evitar conflitos. Crockford acredita que as variáveis globais implícitas não devem ser usadas.
Sem comentários: idiomático, jQuery, npm, node.js
2 estilo de nomeação
2.1 Nomeação variável
A primeira palavra no começo é minúscula, e a primeira letra de todas as palavras depois é a maçaneta: Google, NPM, Node.js, Idiomatic
A cópia do código é a seguinte:
var foo = "";
var fooname = "";
2.2 Nomeação constante
Use letras maiúsculas: Google, NPM, Node.js
A cópia do código é a seguinte: var Cons = 'Value';
Sem comentários: jQuery, idiomático, Crockford
2.3 Nomeação da função
A primeira palavra no começo é minúscula, e a primeira letra de todas as palavras depois é a maçaneta (camelo): Google, npm, idiomática, node.js (recomenda -se usar nomes de funções longas e descritivas)
A cópia do código é a seguinte:
functione muito nomeado nome
função curta () ..
Nomeação da função em forma de palavra -chave:
A cópia do código é a seguinte:
função isready ()
função setName ()
função getName ()
Sem comentários: JQuery, Crockford
2.4 Nomeação da matriz
Use a forma plural: idiomático
A cópia do código é a seguinte: var documents = [];
Sem comentários: Google, JQuery, NPM, Node.js, Crockford
2.5 Nomeação de objeto e classe
Use os seguintes formulários: Google, NPM, Node.js
A cópia do código é a seguinte:
var thisisObject = nova data;
Sem comentários: jQuery, idiomático, Crockford
2.6 Outra nomeação
Use-se-lower-hifen-css-cass para nomes de arquivos longos e chaves de configuração: npm
3. Configure o arquivo .jshintc de acordo com o estilo acima
Jshint (http://www.jshint.com/) é uma sintaxe JavaScript e uma ferramenta de verificação de estilo que você pode usar para lembrar problemas relacionados ao estilo de código. Pode ser bem integrado a muitos editores comumente usados e é uma ótima ferramenta para unificar estilos de codificação de equipe.
Você pode visualizar as opções disponíveis através da Documentação Jshint: http://www.jshint.com/docs/#options
O seguinte é criar um arquivo .jshintc com base no primeiro estilo em cada uma das categorias acima. Você pode colocá-lo no diretório raiz do projeto, e o editor de código JSHint-Avare unificará todos os estilos de código do projeto de acordo com ele.
A cópia do código é a seguinte:
{
"CamelCase": verdadeiro,
"Indent": 2,
"Undef": verdadeiro,
"Quotmark": solteiro,
"Maxlen": 80,
"Trailing": verdadeiro,
"Curly": verdadeiro
}
Além disso, você deve adicionar o seguinte cabeçalho ao seu arquivo JavaScript:
A cópia do código é a seguinte:
/ * Navegador Jshint: True, jQuery: true */
No arquivo Node.js, você deve adicionar:
A cópia do código é a seguinte:
/ *nó jshint: true */
Você também pode adicionar a seguinte declaração em vários arquivos JavaScript:
A cópia do código é a seguinte:
'Use rigoroso';
Isso afetará o JSHint e o seu mecanismo JavaScript e podem não ser tão compatíveis, mas o JavaScript será mais rápido.
4. Execute automaticamente o JSHint antes de cometer o
Se você deseja garantir que todo o código JS seja consistente com o estilo definido no .jshintc, você pode adicionar o seguinte ao seu arquivo .git/ganchos/pré-compromisso, e a verificação de estilo será executada automaticamente quando você tentar enviar quaisquer arquivos recém-modificados para o projeto.
A cópia do código é a seguinte:
#!/bin/bash
# Pré-comprometer o gancho Git para executar o JSHINT em arquivos JavaScript.
#
# Se você absolutamente deve se comprometer sem testar,
# Use: Git Commit--não-Verify
FileNames = ($ (Git Diff-CACHED-NAME-NAME CABEÇA)))
Qual jshint &> /dev /null
se [$? -ne 0];
Então
eco "Erro: jshint não encontrado"
eco "Instale com: sudo npm install -g jshint"
saída 1
fi
para i em "$ {FileNames [@]}"
fazer
se [[$ i = ~ /.js$]];
Então
eco jshint $ i
jshint $ i
se [$? -ne 0];
Então
saída 1
fi
fi
feito