Carregando...

Âmbito (scope)

Você já declara variáveis, escreve funções e devolve valores. Outra regra decide se um nome é alcançável: o escopo. Ele responde: «daqui, quais nomes posso usar?»

O que o escopo significa

Escopo é a região do programa onde um nome existe. Fora dela, a mesma grafia pode ficar invisível — ou apontar para outra ligação. Pense em cômodos: um rótulo na cozinha aparece na cozinha; não surge sozinho na rua.

Três tipos do dia a dia

📊 Escopo global, de função e de bloco

Tipo Onde o nome vive Ferramentas típicas Visível onde?
global fora de toda função let / const / var no nível superior em todo o script (mesma página)
função (local) dentro do corpo parâmetros e locais só dentro dessa função
bloco dentro de { } como if ou loop let e const só dentro desse bloco

Esses três cobrem a maior parte do código iniciante. Locais de função ficam privados. Ligações de bloco com let e const ficam entre chaves. Globais são compartilhados — úteis para um contador comum, arriscados se tudo virar global.

Um nome global

javascript 
let city = "Tehran";
function showCity() {
console.log(city);
}
showCity();
console.log(city);

Nomes globais ficam fora das funções

city é declarado no nível superior, então a função e o console.log seguinte o leem. Mude a string uma vez; cada leitor vê o valor novo. Prefira globais só quando várias partes realmente compartilham um valor.

Um nome local dentro de uma função

javascript 
function greet() {
let message = "Hello";
console.log(message);
}
greet();
// console.log(message); // Error: message is not defined

Locais ficam na função

message existe só enquanto greet roda. Fora, esse nome não está definido. Parâmetros iguais: locais à função que os lista.

Escopo de bloco com let

javascript 
if (true) {
let score = 10;
console.log(score);
}
// console.log(score); // Error: score is not defined

let e const respeitam blocos

Dentro de { }, uma ligação let ou const só é visível nesse bloco. Depois da chave de fechamento, score some. O var antigo é de função e pode «vazar» do bloco. Prefira let e const para que a borda do bloco signifique o que parece.

Código aninhado lê para fora

javascript 
let title = "Shop";
function show() {
let label = "open";
console.log(title + " is " + label);
}
show();

O aninhado olha para fora

show lê o title externo e o próprio label. A busca vai para fora até achar correspondência. Não para dentro: código externo não vê um nome nascido só na função.

Nome interno sombreia o externo

javascript 
let status = "ok";
function check() {
let status = "busy";
console.log(status);
}
check();
console.log(status);

Sombreamento: dentro, o interno vence

Dentro de check, o status local esconde o externo. A chamada imprime busy. Depois, o externo continua ok. Mesma grafia, duas ligações — o escopo decide qual você toca.

Mostrar um valor com escopo na página

Guarde um rótulo global, monte numa função uma linha que ainda o leia e escreva o resultado num parágrafo.

Demo de página com escopo

html 
<!DOCTYPE html>
<html>
<head>
<title>scope — page</title>
</head>
<body>
<p id="msg">…</p>
<script>
let place = "Garden";
function line() {
let state = "open";
return place + " is " + state;
}
let box = document.getElementById("msg");
box.textContent = line();
</script>
</body>
</html>

O parágrafo mostra Garden is open. place é global; state é local a line. A função lê os dois, devolve uma string e a página a mostra. Mude só place, atualize e leia a linha. Seguinte: closures — funções que mantêm nomes externos vivos após a chamada externa terminar.

Passos de prática

  1. Declare um let app = "demo" global e registre-o de uma função pequena e de fora.
  2. Coloque let secret = 1 numa função; confirme que registrar secret fora lança erro.
  3. Dentro de if (true) { } declare let n = 5 e registre; tente depois do bloco.
  4. De uma função aninhada, leia um let externo sem redeclarar.
  5. Sombreie let tag = "A" externo com let tag = "B" interno e registre os dois lugares.
  6. Na demo HTML, mude só a string place, atualize e leia o parágrafo.

Erros frequentes

  • Usar um local fora da função — ReferenceError, não um vazio silencioso
  • Esperar que var num bloco fique privado como let
  • Assumir que código externo vê nomes nascidos só numa função aninhada
  • Misturar escopo com return — um é visibilidade; o outro envia um valor
  • Esperar aqui a lição completa de closures — isso é a página seguinte

Resumo

  • Escopo é onde um nome pode ser visto e usado
  • Globais vivem fora das funções e são compartilhados no script
  • Locais e parâmetros ficam na sua função
  • let e const em { } são de bloco; melhor que var que vaza
  • Aninhado pode ler para fora; fora não vê nomes só internos
  • Uma ligação interna com o mesmo nome sombreia a externa
  • A página pode combinar global e local numa string devolvida
  • Seguinte: closures — funções que lembram nomes externos

🧠 Teste Seu Conhecimento

Pronto para Começar

Teste Seu Conhecimento

Desafie-se com este questionário interativo e veja o quão bem você entende o tópico

❓
8
Perguntas
🎯
70%
Para Passar
♾️
∞
Tempo
🔄
∞
Tentativas

📝 Instruções

  • Leia cada pergunta cuidadosamente
  • Selecione a melhor resposta para cada pergunta
  • Você pode refazer o quiz quantas vezes quiser
  • Seu progresso será mostrado no topo
Tópico 31 de 31
Javascript Tutorial