Variáveis JavaScript são objetos onde nós guardamos uma informação apenas em tempo de execução. Por exemplo: se você digita sua data de nascimento em um formulário, podemos guardar essa data em uma variável para calcular a sua idade. Mas se você sair do site e voltar, sua data de nascimento não estará lá automaticamente.
Um conceito importante sobre variáveis é que ao defini-la, estamos reservando um espaço na memória do computador. No caso de JavaScript, como nossas aplicações rodam em navegadores, estamos utilizando a memória deles. Sabe quando você acessa um site que seu Chrome fica uma lerdeza que só? Pode ser uma aplicação com uma gestão ruim da alocação de memória.
Como já falamos na introdução ao JavaScript, a tipagem no JavaScript é dinâmica, e portanto não precisamos dizer se aquela variável espera receber uma string, um número, um array ou outro. O JavaScript se vira com a informação que você inserir.
Em linguagens como C por exemplo, todas as declarações deveriam vir no início do programa, correto? Com o tempo, começou a se pensar, porque não poderíamos fazer as declarações em qualquer lugar do código e o compilador se virar?
Assim foi concebido o conceito de Hoisting, que é o seguinte: os compiladores (ou até linguagens runtime) leem todas as funções e variáveis que estão declaradas no código antes de executá-lo. No momento em que ele vai executar o código, ele já sabe onde está o quê.
Por esse motivo, em JavaScript é possível você usar uma variável antes mesmo de defini-la.
No nosso exemplo acima, como a variável mensagemDentroDoIf está dentro de uma function, a declaração da mesma é elevada (hoisting) para o topo do seu contexto, ou seja, para o topo da function.
É por esse mesmo motivo que “é possível usar uma variável antes dela ter sido declarada”. Pois em tempo de execução a variável será elevada (hoisting) e tudo funcionará corretamente.
Quando declaramos uma variável com var, por padrão essa variável é iniciada com undefined (caso você não atribua nenhum valor ao mesmo tempo).
Adicione a complexidade da utilização do hoisting e tempos um problema: quanto mais complexo for o código, mais difícil é entender o escopo das variáveis declaradas com var.
Let foi um conceito trazido na versão ES6 do JavaScript, para a criação de escopo de bloco assim como em outras linguagens. Em resumo, let é uma forma de criar variáveis sem hoisting.
Aqui vai um conselho, não use mais var. Fica bem mais simples de entender o escopo das variáveis, além de não ficar alocando memória do navegador sem necessidade. Let não é o futuro, é o presente. Let hoje, let amanhã let pra sempre!
Mais um recurso trazido no ES6. Const é utilizado para criar variáveis imutáveis, ou seja variáveis que não podem ter seu valor alterado. Usar const garante que ao utilizar a variável ela estará iniciada com um valor diferente de undefined.
Const também tem escopo de bloco, mas o mais interessante, é que o valor de uma const não pode ser alterado.
Sempre que possível não utilize var. Observe atentamente os locais que você deve usar let e assim que possível abuse de const.
Existe um debate interessante sobre variáveis JavaScript no Github, no fórum do @frontendbr: Existe alguma razão para usar ‘var’ a partir do ES6?
Desvendando o Potencial da Blockchain e Criptomoedas através da Criptografia Em um mundo onde a…
O deploy de uma aplicação React é uma etapa crucial para disponibilizar sua criação na…
Satellite 2020 foi a primeira conferência virtual do Github. O Github já tinha sido liberado…
Neste guia veremos o que são web components, quando usar, sua estrutura e também um…
A alguns anos atrás escrevi um texto sobre o que é o frontend, também palestrei…
O que é SVG é a sigla para Scalable Vector Graphics que traduzindo seria gráficos…