Diferenças no escopo entre VAR, LET e CONST §

A diferença no escopo é uma das características mais marcantes entre as variáveis declaradas com var e aquelas declaradas com let e const. O escopo determina onde a variável é visível e acessível no código.

var §

A variável declarada com var possui escopo de função. Isso significa que a variável é visível em todo o escopo da função onde foi declarada, independentemente de blocos de código (if, for, etc.).

var escopo = "Escopo do bloco maior"; // declaração
 
if (true) {
  var escopo = "Escopo do bloco intermediário"; // redeclaração
 
  if (true) {
    var escopo = "Escopo do bloco menor"; // redeclaração
    console.log(escopo); // Escopo do bloco menor
  }
}
 
// A variável 'escopo' ainda é acessível aqui e tem o valor "Escopo do bloco menor"

Além disso, é possível redeclarar uma variável var dentro do mesmo escopo, o que pode causar confusão e erros inesperados.

let e const §

As variáveis declaradas com let e const têm escopo de bloco. Isso significa que a variável é visível apenas dentro do bloco de código onde foi declarada.

let escopo = "Escopo do bloco maior (escopo global)";
 
if (true) {
  let escopo = "Escopo do bloco intermediário";
 
  if (true) {
    let escopo = "Escopo do bloco menor";
    console.log(escopo); // Escopo do bloco menor
  }
}
 
// A variável 'escopo' aqui se refere ao bloco global e tem o valor "Escopo do bloco maior (escopo global)"

A variável escopo declarada com let no bloco interno não afeta a variável escopo no bloco externo. Cada bloco cria um novo escopo para a variável.

É importante notar que as variáveis let e const não permitem a redeclaração no mesmo escopo, evitando assim confusões e erros.

let sobrenome = "Miranda";
 
function falarOi() {
  let nome = "Luiz";
  console.log(nome, sobrenome); // Luiz Miranda
}
 
falarOi();
console.log(nome); // Erro: "nome" is not defined

No exemplo acima, a variável nome declarada com let é visível apenas dentro da função falarOi, não afetando o escopo global. Isso ajuda a evitar conflitos de variáveis no código.

Referências §

---

• Curso de JavaScript e TypeScript do básico ao avançado