Javascript: qual a diferença entre VAR e LET?


Após o lançamento do Javascript 6 (ECMAScript 6 ou ES2015) uma das grandes dúvidas que surgiram foi: Qual é a diferença entre var e let?

Isso porque o let não existia no javascript e foi incorporado nesta versão da linguagem. As duas palavras-chave (var e let) são utilizadas para declarar variáveis e funcionam quase do mesmo jeito. A única diferença entre as duas é o escopo em que essas variáveis existem.

Enquanto as variáveis declaradas com let têm escopo de bloco, instrução ou expressão, as variáveis declaradas com var têm escopo global ou escopo de função.

Antes de tudo é necessário entender o que é escopo de variáveis: Escopo de variáveis nada mais é do que onde uma variável existe.

Faça-se a seguinte pergunta: se eu declarar uma variável dentro de um bloco de if por exemplo, esta variável deve existir fora deste bloco de if?

Se a sua resposta foi sim, você deve usar var para declará-la. Mas se a sua resposta foi não, ou seja, esta variável deve existir apenas dentro do if, você deve usar let para declará-la neste caso.

A ideia funciona para qualquer tipo de bloco: if, for, while, função, etc.

Veja essa diferença na prática, criando uma variável dentro de um bloco if e tentando acessá-la fora do bloco.

if( true ){
    var variavel1 = 'teste';
}
console.log(variavel1);// <-- Funciona com "var"

Sendo bem direto essa é a diferença básica entre o var e o let. Se você declarar a variável com var dentro de um bloco if por exemplo, esta variável pode ser acessível fora desse bloco, como no exemplo acima.

Entretanto se você declarar a variável com let ela só existirá dentro daquele bloco. Ou seja, o código abaixo dá erro na última linha.

if( true ){
    let variavel2 = 'teste';
    console.log(variavel2);// <-- Funciona dentro do bloco do IF
}
console.log(variavel2);// <-- NÃO funciona com "let"

Veja esses exemplos funcionando no console do meu browser.

Teste var e let

Claro que tem outros conceitos sobre escopos em Javascript que merecem outro post mais detalhado.

A minha dica é que você use o let sempre que possível, pois desta forma você estará liberando espaço de memória sempre que o escopo de bloco da variável terminar. O que não acontece com o var que mantém o espaço da variável ocupado na memória, mesmo depois que que a execução do bloco termina.

Também é importante notar que declarar variáveis com let, faz o javascript mais parecido com outras linguagens de programação, como o java por exemplo, onde as variáveis respeitam as regras de escopos de bloco.

Lembre-se: as variáveis declaradas com let têm escopo de bloco, instrução ou expressão e as variáveis declaradas com var têm escopo global de função.

Referências

  1. Mozila: LET
  2. Mozila: VAR