Qual a diferença entre declarar variável com let e var

Neste artigo você aprenderá qual a diferença entre declarar variável com let e var, além de saber quando utilizar cada uma das duas instruções.

Fala programador(a), beleza? Bora aprender mais sobre JavaScript e suas formas de declarar variáveis!

A ideia é que você não deve utilizar mais var em programas que utilizam a versão mais atualizada da linguagem JavaScript

Formação Recomendada

Formação Vibe Coding

Do Prompt ao Produto: Crie Software Real com IA

• 474 aulas
• 20 projetos
• 39h 27min

Conhecer formação

Isso acontece porque temos um problema de escopo utilizando este método, que é resolvido com o let

Podemos separar as variáveis em bloco, utilizar uma variável com o mesmo nome dentro e fora de uma função

Veja um exemplo clássico:

let x = 12;

if(true) {
 let x = 5;
 console.log(x);
}

console.log(x);

var y = 12;

if(true) {
 var y = 5;
 console.log(y);
}

console.log(y);

A saída será:

12
5
5
5

Isso por que com let criamos um escopo até no if, não alterando nossa variável definida anteriormente de forma global como x

Já o var sobrescreveu o valor de y dentro do if, que é um elemento de bloco, mas por ser declarada com var ela não separada o escopo nesta instrução

Então percebemos que let é além de tudo uma boa prática também, tendo que ser optada pelos novos softwares em JavaScript

Outro conceito interessante é que se utilizarmos uma variável por var antes de ser definida ela é tratada como undefined

Já o let nos retorna um erro, de que a variável ainda não foi definida

Aumentando a segurança do código, pois só poderemos utilizar uma variável caso ela for inicializada, não nos retornando resultados imprevistos como undefined

Veja o exemplo:

console.log(x);
var x = 0;

console.log(y);
let y = 1;

Aqui receberemos undefined para x e para y um erro de que a variável ainda não foi definida

Conclusão

Neste artigo vimos a diferença entre declarar variável com let e var

Desencorajei a declaração de var pois ela tem seus problemas, só fique atento que alguns navegadores podem não aceitar o uso de let e as funcionalidades do ES6

Para isso você vai ter que fazer um transpile do seu código, fazendo com que ele se adapte a todos os navegadores, com Babel por exemplo

Confira também nosso catálogo de cursos gratuitos, com aulas semanais no YouTube