Var, let ou const, qual devo usar?
Quando falamos em Javascript é normal vir à cabeça algumas das peculiaridades da linguagem, e para iniciantes muitas coisas parecem tão bicho de sete cabeças, por exemplo as opções de declaração de variáveis.
No início eu também me perguntava o por quê de existir as palavras chave
var, let e const para declaração de
variáveis, como e quando usá-las.
Pois bem, vamos tentar entender os conceitos e usos, mas antes vamos falar
do famoso hoisting.
Hoisting
Em Javascript todas as variáveis sofrem hoisting — são içadas/elevadas — ao topo do contexto de execução no qual elas estão.
Então por esse motivo é possível usar uma variável antes dela ter sido declarada — não confunda com usar sem declarar, isso daria erro —, pois em tempo de execução a variável sofrerá hoisting — será elevada — e tudo funcionará como esperado.
Conceito de hoisting entendido até agora, certo?
var
Esta é a forma mais antiga, mais utilizada e atualmente menos recomendada, porém a única que 100% dos browsers entende.
Declarações com var não ficam no escopo de bloco, mas sim de
função, ou global como podemos ver a seguir:
À primeira vista e em pequenos projeto isso pode não parecer um problema, mas imagine um grande projeto onde precisa de uma varíavel apenas em um certo escopo, de bloco por exemplo. Quando a variável for içada teremos um problema, estaremos para sempre ocupando espaço em memória que só vai ser útil em uma parte do código.
Para resolver esse problema de escopo então, foi implementada a
keyword let. Vamos revisar usando a mesma ideia do
código anterior:
Opa, agora se rodarmos o código teremos um erro similar a:
Uncaught SyntaxError: Identifier 'test' has already been declared at line 16 col 5
Opa, aqui diz que a variável test a qual tentamos
declarar na linha 16 já existe, então vamos só tirar o let da
linha 16.
Agora temos outro erro, dessa vez do tipo:
Uncaught ReferenceError: stringTest is not defined at line 3 col 15
Este erro diz que a variável chamada na linha 3 não foi definida.
Vamos comentar a linha 3 e agora temos o mesmo erro, mas na linha 11 a qual também vamos comentar.
Ok, vimos que fora do escopo de if(){} a varível
stringTest sempre dá erro de referência.
Beleza, problema de escopo resolvido. Agora a variável só existe no escopo onde foi definida, e morre no final dele.
Mas dependendo do que queremos fazer ainda temos um problema, o valor da
variável continua sendo sobrescrito na linha 16, pensando nisso também, foi
implementado a const.
Com ela declaramos uma variável cujo valor/tipo nunca pode ser alterado
programaticamente e também segue o conceito de escopo como a
let como podemos ver no exemplo a seguir
Ao rodar teremos um erro de referência similar a:
Uncaught ReferenceError: stringTest is not defined at line 7 col 15
Vamos comentar a linha 7 e ver o erro mudar para um TypeError na linha 12. Isso quer dizer que agora não podemos sobrescrever a variável — agora constante — test.
JS é mesmo ótimo, não?
Quando devo usar cada um?
Isso depende do seu projeto porém em todo caso onde a variável pode sofrer alteração, é aconselhável o uso de let.
Se precisa que um valor sempre se mantenha, use a const.
Se precisar de alta compatibilidade entre browsers mais antigos, a var.
Ok, espero que até aqui esteja tudo entendido.
Um abraço e até a próxima.
Caso tenha dúvidas, pode colocar nos comentários.
Comentários
Postar um comentário
O que achou do artigo?