JavaScript – Melhores Práticas para Iniciantes I

Filed Under (Dicas, Javascript) by Cristian Trentin on 20-07-2009

Esse é o primeiro post de uma série de três, onde estou fazendo a tradução parcial e trazendo o melhor do post original “24 JavaScript Best Practices for BeginnersLink Externo” de Jeff WayLink Externo.

1 – Use === ao invés de ==

O JavaScript utiliza dois diferentes operadores de igualdade, quando precisamos comparar dois valores e também seus tipos de dados se faz necessário o uso ===, agora quando precisamos comparar apenas seus valores mas não o tipo de dados podemos usar ==.

No PHP também é possível o uso desses dois operadores!

2 – Não use o Eval

Para quem não conhece o eval vamos dar um exemplo:


eval("alert(2+2)")

Quando executamos o script acima teremos como saída o valor 4, pois bem, o eval permite que tenhamos acesso ao compilador do Javascript, com isso baixando o desempenho do seu script e criando riscos de segurança.

3 – Use { } e ;

Muitos desenvolvedores preferem escrever seus scripts omitindo as { } e os ; no final de cada linha, pois bem, prefira fazer uso dessa técnica apenas quando seu script não passar de uma linha

if(2 + 2 === 4) return 'nicely done';

Mas mesmo assim imagine que você poderá um dia precisar acrescentar algumas linhas a esse código e ai terá que reestruturar essa parte. O ideal é escrever seu script da maneira mais completa possível e lembrando sempre que uma boa indentação é muito importante.


if(someVariableExists) {
     x = false;
}

!

4 – Use JSLint

JSLintLink Externo é uma ferramenta que analisa e lhe reporta possíveis erros e onde aproximadamente eles estão localizados em seus códigos, como a própria descrição no site da ferramenta diz “Ferramenta para códigos JavaScript de qualidade”.

5 – Colocar Scripts no final da página

É comum ver todos os scripts de uma página sendo carregados no inicio dela, pois bem, existem scripts que não tem finalidade sem que o usuário clique em um botão ou algo do gênero, com isso é recomendado a inserção desses scripts no final de suas páginas antes da tag body. Fazendo com o que interessa para o usuário carregar primeiro.

6 – Declarar variáveis fora do laço de repetição

Não é recomendável


for(var i = 0; i < someArray.length; i++) {
   var container = document.getElementById('container');
   container.innerHtml += 'my number: ' + i;
   console.log(i);
}

Melhor maneira


 var container = document.getElementById('container');
var len= someArray.length;

for(var i = 0; i < len; i++) {
   container.innerHtml += 'my number: ' + i;
   console.log(i);
}

Não sendo necessário nessa segunda opção a requisição para conteiner e nem o calculo para o Array.

7 – Criando seqüências rapidamente

Normalmente as funções não-nativas são bem mais lentas do que funções nativas, independentemente do que esta por trás dessa função.

Vamos a um exemplo de como criar uma lista fazendo uso do join:


var arr = ['item 1', 'item 2', 'item 3', ...];
var list =  '<ul><li>' + arr.join('</li><li>') + '</li></ul>';

8 – Reduzir declarações de varáveis globals


var name = 'Jeffrey';
var lastName = 'Way';

function doSomething() {...}

console.log(name); // Jeffrey -- or window.name

Melhor maneira


var DudeNameSpace = {
   name : 'Jeffrey',
   lastName : 'Way',
   doSomething : function() {...}
}
console.log(DudeNameSpace.name); // Jeffrey

Note que trabalhamos apenas com uma variável e obtemos o mesmo resultado.

Bom esse é o primeiro post com 8 tópicos abortados, faltando então mais dois posts com 8 tópicos cada um. No final das melhores práticas para iniciantes em JavaScript iremos abortar as melhores práticas para iniciantes em PHP.

Comentários:

(2) Comentários

Manda bala no seu comentário