Escopo de variáveis: onde suas 'caixinhas' são visíveis

Entenda a diferença entre variáveis globais e locais e como elas interagem.

Nesta lição, você vai entender um conceito essencial em JavaScript: escopo.
Escopo é o “alcance” de uma variável, ou seja, em quais partes do código ela pode ser enxergada e usada.

Uma analogia simples: pense em variáveis como caixinhas com etiqueta.

  • Algumas caixinhas ficam na sala principal da casa (escopo global): quase todo mundo consegue ver.
  • Outras ficam dentro de um quarto específico (escopo local): só quem está dentro daquele quarto consegue acessar.

Escopo global

Uma variável global é criada fora de funções e blocos.
Ela pode ser acessada em várias partes do código.

let curso = "JavaScript Essencial"; // variável global

function mostrarCurso() {
  console.log(curso);
}

mostrarCurso(); // JavaScript Essencial
console.log(curso); // JavaScript Essencial

Aqui, curso está “na sala principal”: tanto dentro quanto fora da função ela é visível.

Escopo local (de função)

Variáveis criadas dentro de uma função só existem dentro dela.

function saudacao() {
  let nome = "Ana"; // variável local
  console.log("Olá, " + nome);
}

saudacao(); // Olá, Ana
// console.log(nome); // erro: nome não está visível fora da função

A variável nome fica “no quarto da função”. Fora desse quarto, ela não existe.

Escopo de bloco ({ }) com let e const

Blocos como if, for e while também criam escopo para let e const.

if (true) {
  let mensagem = "Estou dentro do bloco";
  console.log(mensagem); // funciona
}

// console.log(mensagem); // erro: fora do bloco não enxerga

Ou seja, a caixinha mensagem existe só dentro das chaves.

E o var?

O var é mais antigo e tem comportamento diferente: ele não respeita escopo de bloco da mesma forma que let e const.

if (true) {
  var cidade = "Recife";
}

console.log(cidade); // Recife

Por isso, no JavaScript moderno, geralmente preferimos let e const, pois dão mais previsibilidade e evitam bugs.

Sombra de variáveis (shadowing)

Você pode ter duas variáveis com o mesmo nome em escopos diferentes.

let valor = 10; // global

function exemplo() {
  let valor = 20; // local (sombra da global)
  console.log(valor); // 20
}

exemplo();
console.log(valor); // 10

Dentro da função, o JavaScript usa a variável local primeiro.

Por que escopo é importante?

Entender escopo ajuda você a:

  • evitar conflitos de nome;
  • reduzir erros difíceis de rastrear;
  • escrever código mais organizado e seguro;
  • controlar melhor onde cada dado pode ser usado.

Boas práticas rápidas

  • Prefira const por padrão.
  • Use let quando precisar mudar o valor.
  • Evite var em código novo.
  • Crie variáveis no menor escopo possível.

Resumo da lição

Escopo define onde uma variável pode ser acessada.
Variáveis globais têm alcance maior; variáveis locais e de bloco ficam restritas a áreas específicas do código.
Dominar escopo é como organizar bem as caixinhas da sua casa: cada coisa no lugar certo, com menos bagunça e menos erro.