Pare com os Vars

Se há algo que é um sinal maior de preguiça (ou incompetência (ou ignorância)) em Javascript, é a declaração constante de variáveis ​​em funções. O que quero dizer é o seguinte:

function terribleFunc() { 
     var x = 0;
     var y = 1;

     for (var i = 0; i < 10; i++) {
         var num = x + i;
         var total  = num + y * x;
         y *= i;
     }

     var data = {
         prop1: x
         , prop2: y
     }

     return data;
}

Não se preocupe com o que a função faz, tenho certeza de que na verdade ela não faz nada. Vejo isso o tempo todo em código de demonstração ou código de repositório para plug-ins ou bibliotecas na web. A questão é que você nunca precisa de mais de uma varinstrução em qualquer escopo de função. Reescrito, terribleFunc()deve ser parecido com isto (novamente, não se preocupe com o que faz, concentre-se na estrutura):

function terribleFunc() { 
     var x = 0 //variables with value declarations
         , y = 1
         , i, num, total, data //variables without value declarations
     ;

     for (i = 0; i < 10; i++) {
         num = x + i;
         total  = num + y * x;
         y *= i;
     }

     data = {
         prop1: x
         , prop2: y
     }

     return data;
}

Observe como puxei todas as variáveis ​​para fora e para o topo da função. Se você leu o reverenciado “Código Completo”, sabe que ele diz que você deve declarar as variáveis ​​o mais próximo possível de seu uso. Isso é absolutamente correto … para todos os idiomas, exceto Javascript. Por causa da elevação , o interpretador Javascript reestrutura seu código como o segundo exemplo de qualquer maneira, então é melhor ter tudo como será em tempo de execução para que você saiba exatamente o que está acontecendo em seu código.

Uma coisa novato programadores Javascript errar é pensar que as estruturas de controle de loop ( for, while, etc.) têm escopo de variáveis; eles não. Se você declarar uma variável dentro de um loop, ela será suspensa em tempo de execução, o que significa que você pode ter alguns problemas com os valores das variáveis.

Observe também como eu declarei todas as minhas variáveis ​​usando uma varinstrução. Embora você possa não concordar com a minha notação de vírgula , a estrutura geral é muito mais limpa, já que várias varinstruções não são apenas desnecessárias, mas adicionam mais bytes ao que é enviado pela transmissão no download. O último pode não parecer grande coisa para pequenos projetos, mas se você estiver usando uma vardeclaração para cada declaração de variável em um arquivo grande, esses bytes se somam.

tl; dr

Ao declarar uma variável em uma função Javascript, coloque-a em uma lista com uma vardeclaração no topo para evitar erros e manter sua função limpa.