VAR, CONST, LET e Escopo de variáveis
Com a introdução do ECMAScript 6 (ES6) duas novas maneiras de declarar uma variável apareceram em Javascript, são elas: const e let.
Javascript é uma das linguagens mais utilizadas no mundo atualmente e sem dúvidas é uma linguagem poderosa e em constante evolução e melhoria. É praticamente impossível (pra não dizer impossível) programar para a web sem utilizar Javascript, se você é desenvolvedor web assim como eu, sabe disso. Por esse motivo, no artigo a seguir (o primeiro que escrevo por sinal) resolvi contar um pouco do que sei sobre as declarações de variáveis em Javascript.
Abaixo cito as diferenças entre as declarações de variáveis utilizando Var, Let e Const e também o que vem a ser Escopo Global.
VAR
Variáveis declaradas com o var tem o seu valor vazado do escopo no qual são definidas, isso quer dizer basicamente que se você declarar uma variável como var dentro de um if por exemplo, essa variável será acessível fora dele, mesmo que tenha o seu valor como undefined. Isso acontece por conta do hoisting, que faz com que a variável seja jogada para o topo do código, e por estar declarada dentro de um bloco, o seu valor não poder ser atribuído, gerando assim um valor de saída como undefined.
Se declararmos uma variável com var dentro de uma função ou de um bloco, o valor dessa variável não poderá ser acessada de fora dessa função ou desse bloco. Porém, se declararmos uma variável com var e tentarmos acessá-la de dentro de uma função ou de um bloco, aí sim isso será possível, bem como re-declarar uma variável com mesmo nome e mesmo valor, a última a ser escrita sobrescreve o valor da primeira, e isso é péssimo.
Exemplo de reescrita de valor:
A saída será ‘Outro nome’, isso porque o Javascript sobrescreve a variável existente. Abaixo temos um exemplo de uma variável declarada com var podendo ser acessada de dentro de uma função:
Porém, se declaramos uma variável com var dentro de uma função, e tentarmos acessar a mesma de fora dessa função, teremos um erro do tipo “is not defined”, ou seja, para o Javascript, essa variável não existe fora do escopo de onde ela foi declarada. No exemplo abaixo o seu escopo está apenas dentro da função:
Outro exemplo de vazamento de valor de variáveis declaradas com var é quando executamos um loop e para controlar esse loop utilizamos uma variável de iteração com o var, o resultado disso é que o valor da variável de iteração poderá ser acessado de fora do loop, e isso pode causar problemas com esse valor vazado, porque se você declarar outra variável com o nome i e fizer alguma operação matemática com ela, esse valor adquirido no loop irá junto, além de ser algo indicado.
Por isso o ideal é que seja utilizado o let como variável de iteração, porque ao rodar o mesmo código acima, trocando o var pelo let, percebemos que o valor da variável de iteração já não pode mais ser acessado de fora do loop.
CONST
O const, é recomendado para ser utilizado em constantes, ou seja, variável que geralmente não terão o seu valor alterado, sendo assim elas são constantes. O const irá manter o seu escopo de bloco, ou seja, se uma const for declarado dentro de uma função, por exemplo, o seu valor será acessado e utilizado apenas dentro dessa função. Outro ponto forte do const é que ele impede a re-declaração de valores, por exemplo, se declararmos uma constante com o nome preço e tentarmos re-declarar o seu valor, teremos um erro:
O erro acima acontece na parte de atribuição de valores do Javascript, quando ele tenta atribuir um novo valor a uma constante que já possui um valor atribuído. Outro exemplo de bug que a utilização do const ajuda a evitar é como o exemplo abaixo, onde tentamos declarar uma constante com o mesmo nome duas vezes, se fizermos isso, o Javascript vai nos mostrar um erro indicando que não é possível possuir duas constantes com o mesmo nome:
O erro acima é apontado na parte de execução do Javascript. Mais precisamente na parte do hoisting. Que é quando ele joga todas as variáveis para cima e começa a executar o código sequencialmente, porque no momento do hoisting ele vai perceber que estamos tentando declarar duas vezes uma constante com mesmo nome e vai acusar um erro.
LET
Já o let também funciona com o seu escopo de bloco, ele impede re-declaração de duas variáveis let com o mesmo nome, e permite modificação no seu valor. Então o código abaixo que daria erro utilizando const, se executarmos ele utilizando let, não teremos erro:
ESCOPO GLOBAL
No Javascript uma variável que for declarada sem um dos declaradores (var, const ou let) será uma variável global que poderá ser acessada de qualquer parte do código, isso deve ser evitado para que erros não aconteçam, existe até uma expressão utilizada para que o Javascript passe a acusar um erro caso esse tipo de declaração seja feita, essa expressão é o ‘use strict’, com isso o Javascript vai entrar em seu modo estrito, e vai fazer com que a leitura do código seja mais rigorosa, ou seja, estamos forçando o JS a ser mais rigoroso quanto declarações de variáveis e sintaxe.
Se tentarmos executar o código abaixo sem o uso do ‘use strict’, o JS vai executar o código normalmente:
Porém basta que usemos o ‘use strict’ e se executarmos o código acima novamente, o Javascript que agora está mais cauteloso, nos dará um erro de declaração de variável.
Bem pessoal, por hoje é isso. Esse é o primeiro artigo que publico no Medium e na vida (tirando os artigos acadêmicos of course!), peço que me perdoem por algo que não foi dito acima ou algo que não ficou claro, mas como esse é o primeiro de muitos, estou feliz e ansioso de certa forma. Espero que o que escrevi acima ajude você que leu até o fim. Aliás, pra você que leu até o fim, deixo aqui o meu muito obrigado!!!
Top comments (0)