1. Poluição de namespace global
Sempre envolva o código em uma expressão de função imediata para formar um módulo independente.
Não recomendado
var x = 10, y = 100; console.log (window.x + '' + window.y);
recomendar
; (função (janela) {'use strict'; var x = 10, y = 100; console.log (window.x + '' + window.y);} (janela));2. Execute a função imediatamente
Na função de execução imediata, se as variáveis globais forem usadas, o corpo da função que executa a função imediatamente poderá ser chamado na forma de variáveis locais quando chamado, o que melhora o desempenho do programa até certo ponto.
E você deve adicionar undefined aos parâmetros formais da função imediatamente, na última posição, porque undefined no ES3 pode ser lido e escrito. Se o valor de undefined for alterado na posição global, seu código poderá não obter resultados em atraso.
Além disso, recomenda -se adicionar semicolons no início e no final da função imediatamente para evitar afetar nosso próprio código devido ao código irregular de outras pessoas durante a fusão.
Não recomendado
(function () {'use strict'; var x = 10, y = 100, c, elem = $ ('body'); console.log (window.x + '' + window.y); $ (document) .on ('clique', function () {}); if (typeof c === '' indefinido ') { /seu código}}recomendar
(function ($, janela, documento, indefinido) {'use strict'; var x = 10, y = 100, c, elem = $ ('body'); console.log (window.x + '' + window.y); $ (document) .on ('click', function () {}); se (tipo de c === '};3. Modo rigoroso
O modo rigoroso do ECMAScript 5 pode ser ativado em todo o script ou dentro de um único método. Ele corresponde a diferentes contextos JavaScript e executará verificações de erro mais rigorosas. O modo rigoroso também garante que o código JavaScript seja mais robusto e seja mais rápido.
O modo rigoroso impede o uso de palavras -chave reservadas que provavelmente serão introduzidas no futuro.
Você deve ativar o modo rigoroso em seu script, aplicá -lo de preferência em uma função de execução imediata independente. Evite usá-lo na primeira linha do seu script que faz com que todos os seus scripts iniciem o modo rigoroso, o que pode causar problemas com alguma biblioteca de terceiros.
Não recomendado
'Use Strict'; (function () {} ());recomendar
(function () {'use strict';} ());4. Declaração variável
Para todas as declarações variáveis, devemos especificar var . Se var não for especificado, um erro será relatado no modo rigoroso e as variáveis dentro do mesmo escopo devem ser declaradas com um var o máximo possível, e várias variáveis devem ser separadas por "".
Não recomendado
function myfun () {x = 5; y = 10;}Não é totalmente recomendado
function myfun () {var x = 5; var y = 10;}recomendar
function myfun () {var x = 5, y = 10;}5. Julgamento comparativo usando o julgamento do tipo
Ele usa o operador de comparação exato === para evitar os problemas causados pelo elenco do JavaScript durante o processo de julgamento.
Se você usar o operador ===, as duas partes na comparação devem ser do mesmo tipo a ser válido.
Não recomendado
(function (w) {'use strict'; w.console.log ('0' == 0); // true w.console.log ('' == false); // true w.console.log ('1' == true); // true W.Console.Log (null == 'Undefined); w.console.log (x == 'x'); // true} (window.console.log));recomendar
(function (w) {'use strict'; w.console.log ('0' === 0); // false w.console.log ('' === false); // false w.console.log ('1' === true); // false W.Console.Log (null === Menvenfined); };6. Operações lógicas quando atribuição variável
Operadores lógicos || e && também pode ser usado para retornar valores booleanos. Se o objeto de operação for um objeto não-booleano, cada expressão será julgada da esquerda para a direita. Com base nesta operação, sempre há uma expressão que é retornada no final. Isso pode ser usado para simplificar seu código ao atribuir variáveis.
Não recomendado
if (! x) {if (! y) {x = 1; } else {x = y; }}recomendar
x = x || y || 1;
7. Semi-Colon
Sempre use semicolons porque o ninho implícito de código pode causar problemas indetectáveis. Obviamente, devemos eliminar fundamentalmente esses problemas [1].
Os exemplos a seguir mostram o dano de perder um semicolon:
// 1.myclass.prototype.mymethod = function () {return 42;} // não há semicolon aqui (function () {}) (); //2.var x = {'i': 1, 'j': 2} // Não há semicolon aqui // Eu sei que você nunca pode escrever esse código, mas vou dar um exemplo [ffversion, ieversion] [isie] (); // 3.Var Things_To_Eat = [Apples, Oysters, sprayoncheese] // Não há semicolon aqui-1 == ResultOFoperation () || morrer();Resultados do erro
1. Erro de JavaScript - A função que retorna 42 é chamada primeiro pelo parâmetro na segunda função e, em seguida, o número 42 também é "chamado", resultando em um erro.
2. Oitenta vezes, você receberá a mensagem de erro de 'Nenhuma propriedade em indefinida', porque a chamada no ambiente real se parece: xffversion, ieversion ().
3.die é sempre chamado. Como o resultado de menos 1 na matriz é NAN, ela não é igual a nada (independentemente de o resultado de retorno de retorno da NAN ou não). Portanto, o resultado final é que o valor obtido após o dado () é executado será atribuído a Things_To_Eat.
8. Declarações de função em blocos de declaração
Nunca declare as funções dentro dos blocos de declaração, que são ilegais em modo rigoroso do ECMAScript 5. As declarações de função devem estar no nível superior do escopo. No entanto, dentro do bloco de declaração, a declaração da função pode ser convertida em uma expressão de função e atribuída a uma variável.
Não recomendado
if (x) {function foo () {}}recomendar
if (x) {var foo = function () {};}9. Não use a função de avaliação
eval() não está apenas confundindo o contexto, mas também perigoso. Sempre haverá outra solução para escrever seu código melhor, mais claro e mais seguro que isso, então tente não usar a função eval .
10. Array e literais de objeto
1. Use a matriz e os literais de objeto em vez de construtor de matriz e objeto. Os construtores de matriz podem cometer facilmente erros em seus parâmetros.
Não recomendado
// Comprimento da matriz 3Var A1 = New Array (x1, x2, x3); // Comprimento da matriz 2Var A2 = New Array (x1, x2); // Se x1 for um número natural, seu comprimento será x1 // se x1 não for um número natural, seu comprimento será 1Var A3 = novo (x1); var a4;
Por esse motivo, se o código passar de dois para um, existe uma grande possibilidade de que a matriz experimente mudanças inesperadas de comprimento. Para evitar situações tão estranhas, sempre use literais de matriz legível.
recomendar
var a = [x1, x2, x3]; var a2 = [x1, x2]; var a3 = [x1]; var a4 = [];
2. O construtor de objetos não terá problemas semelhantes, mas, para legibilidade e uniformidade, devemos usar literais de objeto.
Não recomendado
var o = new Object (); var o2 = new Object (); o2.a = 0; o2.b = 1; o2.c = 2; o2 ['chave estranha'] = 3;
recomendar
var o = {}; var o2 = {a: 0, b: 1, c: 2, 'chave estranha': 3};11. Julgamento da condição de variável tripla (método rápido para IF)
Use o operador ternário para atribuir ou retornar declarações. Use em situações relativamente simples e evite usar em situações complexas. Ninguém quer usar 10 linhas de operadores ternários para mexer suas mentes.
Não recomendado
if (x === 10) {return 'válido';} else {return 'inválido';}recomendar
retornar x === 10? 'válido': 'inválido';
12. Para loop
Durante o processo de uso do loop, o comprimento da matriz é recebido por uma variável, que é propícia para melhorar a eficiência da execução do código. Em vez disso, o comprimento da matriz deve ser recalculado toda vez que o loop desaparecer.
Não recomendado
for (var i = 0; i <arn.length, i ++) {}recomendar
for (var i = 0, len = arr.length; i <len, i ++) {}13. Operações de DOM repetidas
Operações de DOM repetidas, é necessário usar uma variável para receber, em vez de operar frequentemente a árvore Dom, o que tem um impacto ruim no desempenho, no código arrumado e na manutenção fácil.
Não recomendado
$ ('. mydiv'). encontre ('. span1'). Texto ('1'); $ ('.recomendar
var mydiv = $ ('. mydiv'); mydiv.find ('. span1'). text ('1'); mydiv.find ('. Quando jquery .end() está disponível, use .end() deve ser preferido.
recomendar
$ ('. mydiv'). encontre ('. span1'). text ('1') .nd (). encontre ('. .END (). Find ('. Span3'). Texto ('3'); .END (). Find ('. Span4'). Texto ('4');14. Especificações de comentários
Ao descrever comentários, recomenda -se um estilo de comentário formatado e unificado. Tente descrever as idéias ao escrever comentários, e não o que o código faz.
Não recomendado
// Obtenha a função de pedido getOrderById (id) {var order; // ... ordem de retorno;}As anotações de método devem ser usadas uniformemente com anotações no nível do bloco
recomendar
/** * Obtenha dados detalhados do pedido com base no ID do pedido * @param {[número]} id [pedidos id] * @return {[order]} [encomendar detalhes] */function getOrderById (id) {var order; // ... ordem de retorno;}Resumir
O resumo das especificações de redação de código comum do JavaScript acabou basicamente. Este artigo ainda é muito abrangente e tem um certo valor de referência para que todos usem ou aprendam algum JavaScript. Espero que seja útil para todos. Se você tiver alguma dúvida, pode deixar uma mensagem para se comunicar.