Carregando...

Instrução switch

if / else brilha quando a pergunta é sim/não ou um intervalo. Às vezes a pergunta é outra: qual de vários valores fixos é este? Código do dia 1…7, estado "ok" / "warn" / "err", chave de menu. Para essa forma, switch é a ferramenta limpa. Já sabe ramificar; aqui combina um valor com vários case etiquetados.

O que faz o switch?

switch olha para uma expressão entre parênteses. Compara esse valor com cada rótulo case. Quando coincide, executa as instruções desse caminho. break sai do switch para os seguintes não correrem. default é a reserva quando nenhum coincidiu.

As peças num relance

📊 Peças quotidianas do switch

Palavra-chave Leitura quotidiana Uso típico
switch olha para este valor… abrir a escolha
case se for igual a este rótulo… uma opção fixa
break para aqui; sai do switch terminar após coincidir
default se nada coincidiu… caminho de reserva

A coincidência é de igualdade estrita (ideia de ===). Um case numérico não coincide com uma cadeia de dígitos. Mantenha valor e rótulos na mesma forma.

switch simples

javascript 
let day = 3;
switch (day) {
case 1:
console.log("Mon");
break;
case 2:
console.log("Tue");
break;
case 3:
console.log("Wed");
break;
default:
console.log("other");
}

Um valor, vários caminhos etiquetados

Aqui day é 3, por isso corre o caminho case 3 e a Consola imprime Wed. Os cases 1 e 2 foram verificados e saltados. Após break o switch termina — default não corre.

Sem break, o JavaScript continuaria para os corpos dos cases seguintes. Chama-se fall-through. Principiantes quase sempre querem um break após cada case concluído.

Porque o break importa

javascript 
let day = 2;
switch (day) {
case 1:
console.log("Mon");
case 2:
console.log("Tue");
case 3:
console.log("Wed");
break;
default:
console.log("other");
}

Sem break, os cases seguintes também correm

day é 2. A coincidência começa em case 2, imprime Tue, continua para case 3 e imprime Wed antes do break. Queria um rótulo; obteve dois. Ponha break sob cada case concluído, salvo se partilhar código de propósito.

default quando nada coincide

javascript 
let day = 9;
switch (day) {
case 1:
console.log("Mon");
break;
case 2:
console.log("Tue");
break;
default:
console.log("other");
}

default cobre «nenhum destes»

day é 9. Nenhum case coincide, por isso corre default e vê other. Use default quando valores inesperados ainda precisam de uma mensagem segura. Omita só se o silêncio for aceitável.

Cases em cadeia

javascript 
let status = "warn";
switch (status) {
case "ok":
console.log("green");
break;
case "warn":
console.log("yellow");
break;
case "err":
console.log("red");
break;
default:
console.log("unknown");
}

Os cases também podem ser cadeias

status é "warn", por isso vê yellow. Cases em cadeia são comuns para códigos curtos de formulário ou API. Intervalos como «nota de 60 a 90» continuam para if / else if — switch quer rótulos discretos.

Guardar o rótulo escolhido

javascript 
let day = 1;
let label;
switch (day) {
case 1:
label = "Mon";
break;
case 2:
label = "Tue";
break;
default:
label = "other";
}
console.log(label);

Nomeie o resultado da coincidência

Defina label dentro de cada case (e em default), depois use-o uma vez. Aqui label passa a "Mon". O mesmo padrão de if / else — primeiro escolhe, depois usa.

Mostre o caminho escolhido na página

Crie uma mensagem curta com switch e escreva-a na página.

Escolha na página com switch

html 
<!DOCTYPE html>
<html>
<head>
<title>Switch — page choice</title>
</head>
<body>
<p id="out">…</p>
<script>
let day = 3;
let msg;
switch (day) {
case 1:
msg = "Mon";
break;
case 2:
msg = "Tue";
break;
case 3:
msg = "Wed";
break;
default:
msg = "other";
}
let box = document.getElementById("out");
box.textContent = "day=" + msg;
</script>
</body>
</html>

day é 3, a página mostra day=Wed. Ponha day a 9, actualize e deverá ver day=other. A lição seguinte (for) repete trabalho muitas vezes; para «qual rótulo fixo?» a ferramenta continua a ser switch.

Experimente você

  1. Construa um switch com let day = 1 que registe "Mon" no case 1.
  2. Acrescente cases para 2 e 3 com break depois de cada um.
  3. Ponha day a 9 e confirme que default regista "other".
  4. Faça switch numa cadeia status com "ok", "warn", "err".
  5. Remova temporariamente um break e observe o fall-through na Consola.
  6. Na demo HTML mude só day, actualize e leia o novo texto day=.

Erros comuns

  • Esquecer break após um case (os seguintes também correm)
  • Usar switch para intervalos abertos (score >= 60) — prefira if / else if
  • Misturar tipos para um número nunca coincidir com um case em cadeia
  • Omitir default quando valores desconhecidos ainda precisam de mensagem
  • Substituir cada if por switch quando a verificação não é uma lista de rótulos fixos

Resumo

  • switch combina um valor com vários rótulos case
  • break pára o switch após uma coincidência
  • default corre quando nada coincidiu
  • Melhor para valores discretos; intervalos ficam com if / else if
  • Guarde um rótulo se precisar do resultado depois; mostre-o na página quando ajudar
  • Seguinte: ciclo for — repetir trabalho um número fixo de vezes

🧠 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 22 de 23
Javascript Tutorial