10 – Javascript – Declaração de variável com let e const
10 – Javascript – Declaração de variável com let e const
![Funções e Eventos (Functions e Events) Javascript - Declaração de variável com let e const](http://www.codigofluente.com.br/wp-content/uploads/2019/01/Javascript.png)
Javascript – Declaração de variável com let e const
Voltar para página principal do blog
Todas as aulas desse curso
Aula 09 Aula 11
Se gostarem do conteúdo dêem um joinha 👍 na página do Código Fluente no
Facebook
Link do código fluente no Pinterest
Meus links de afiliados:
Hostinger
Digital Ocean
One.com
Javascript – Declaração de variável com let e const
Até agora, em todas as aulas usamos o var para declarar variáveis, ou simplesmente demos um nome a uma variável sem o var mesmo, e atribuímos a ela algum valor.
O ECMAScript permitia que programadores usassem variáveis sem declará-las.
Com o ES6, veio a possibilidade de declarar variáveis com let e const, para superar um problema do javascript, que se refere ao escopo de variáveis, quando usadas sem declarar, ou quando declaradas com var.
Escopo de blocos
As variáveis, nas mais variadas linguagens de programação, são vinculadas ao “bloco” em que são declaradas.
Antes do ES6, com a possibilidade de usar apenas variáveis sem declarar ou usando var para declará-las, as variáveis ficavam vinculadas apenas a função e não a blocos como: while, for, if, etc.
Veja um exemplo de variável com escopo de função:
function imprimeNumero() {
var num = 35;
console.log("Número: ", num);
}
console.log("Número: ", num);
Erro: num is not defined
Beleza, como esperado, a variável só tá definida dentro da função, como foi dito antes, utilizando var, a variável fica vinculada apenas a função.
Mas, se eu declarar uma variável dentro de um for, veja o que acontece:
function imprimeI() {
for(var i = 0; i < 3; i++){
console.log("i dentro do for: ", i);
}
console.log("i fora do for: ", i);
}
Saída:
i dentro do for: 0
i dentro do for: 1
i dentro do for: 2
i fora do for: 3
Veja que o javascript com a declaração var, ou simplesmente omitindo o var, deixa você acessar o valor da variável i, fora do escopo do for.
Isso é errado, esse vazamento de escopo pode quebra a lógica do código.
Agora teste usando let ao invés de var:
function imprimeI() {
for(let i = 0; i < 3; i++){
console.log("i dentro do for: ", i);
}
console.log("i fora do for: ", i);
}
Agora funcionou o escopo de bloco do for! 😉
Com if acontece a mesma coisa.
function imprimeNome() {
if(true){
var nome = "Fulano de Tal";
console.log("Nome dentro do if: ", nome);
}
console.log("Nome fora do if: ", nome);
}
Saída:
Nome dentro do if: Fulano de Tal
Nome fora do if: Fulano de Tal
Agora com o let
function imprimeNome() {
if(true){
let nome = "Fulano de Tal";
console.log("Nome dentro do if: ", nome);
}
console.log("Nome fora do if: ", nome);
}
Saída:
Nome dentro do if: Fulano de Tal
Uncaught ReferenceError: nome is not defined
at imprimeNome…
Vazamento de escopo
Esses problemas de vazamento de escopo em for, while e if no javascript, foi uma fonte sutil de bugs e bastante surpresa para o desenvolvedores C / C ++ / Java / C #.
Além disso, o ECMAScript nunca teve facilidade para criar variáveis imutáveis semelhantes à final em Java ou const em C # ou C ++.
O ECMAScript 6 corrigiu essas coisas.
Ele sugere substituir o uso de var por let, que não pode ser redeclarado.
Ou seja , o let opera da mesma maneira que var, mas, não aceita reatribuição, veja abaixo.
var msg = "Um texto qualquer";
var msg = "Olá programador!"; // reatribui um novo valor a msg
let message = 'Essa é uma mensagem!';
// A linha abaixo causa um erro fatal se você remover o comentário
// let message = 'Essa é outra mensagem!';
console.log(msg);
console.log(message);
Removendo o comentário do let message = ‘Essa é outra mensagem!’ dá o seguinte erro:
Uncaught SyntaxError: Identifier ‘message’ has already been declared at <anonymous>:1:1
Conclusão e boas práticas
Nunca use var, sempre priorize const e se você realmente constatar que uma determinada variável não pode ser const, troque ela para let.
Declaração com const
O uso de const em uma declaração variável aborda a necessidade de imutabilidade.
Uma vez definida, uma variável declarada const nunca pode ser modificada.
const message = 'Primeira mensagem.';
message = 'Segunda mensagem'; // ERROR!
Enquanto uma variável declarada como const não pode alterar seu valor, o objeto para o qual a variável aponta não é constante, portanto, ainda pode ser modificado.
const user = {'firstname' : 'Fulano', 'lastname' : 'de Tal'};
user.firstname = 'Beltrano'; // aceitável, altera uma propriedade
// A próxima linha causa um erro fatal se você remover o comentário
// user = {'firstname' : 'Sicrano', 'lastname' : 'da Silva'};
console.log(user);
Removendo o comentário de user = {‘firstname’ : ‘Sicrano’, ‘lastname’ : ‘da Silva’}; dá o seguinte erro:
Uncaught TypeError: Assignment to constant variable. at <anonymous>:1:6
Ou seja, para mudar um const, só mesmo acessando o atributo via ponto(.), exemplo, user.firstname.
Se quiser alterar usando user = {‘firstname’ : ‘Sicrano’…} dará erro.
Conclusão
O que devo usar então?
O melhor é usar o const sempre que puder.
Caso dê algum erro no seu código tipo: essa variável não pode ser alterada
Você pode alterar a declaração da variável const que tá dando problema, para let.
Nunca use var e nem declare a variável só com o nome dela, isso será a mesma coisa que utilizar var.
Ficamos por aqui e nos vemos na próxima aula, até mais. 🙂
Voltar para página principal do blog
Todas as aulas desse curso
Aula 09 Aula 11
Se gostarem do conteúdo dêem um joinha 👍 na página do Código Fluente no
Facebook
Link do código fluente no Pinterest
Novamente deixo meus link de afiliados:
Hostinger
Digital Ocean
One.com
Obrigado, até a próxima e bons estudos. 😉