[3] Condicionais: if, else e switch

No Javascript nós guardamos informações em variáveis como visto em um outro arrtigo. Mas um programa de verdade precisa tomar decisões. Se o usuário está logado, mostre o painel. Se a senha está errada, exiba um erro. Se o saldo é suficiente, finalize a compra.

É exatamente isso que as estruturas condicionais fazem: permitem que seu código siga caminhos diferentes dependendo de uma condição.

Operadores de Comparação

Antes de entrar no if, precisamos entender como comparar valores. O resultado de uma comparação é sempre true ou false.

const a = 10;
const b = 5;

console.log(a > b);   // true  — maior que
console.log(a < b);   // false — menor que
console.log(a >= 10); // true  — maior ou igual
console.log(a <= 9);  // false — menor ou igual
console.log(a === 10); // true — igual em valor E tipo (use sempre este)
console.log(a !== b);  // true — diferente

Atenção importante: sempre use === em vez de ==. O operador == faz conversão automática de tipos e pode causar resultados inesperados:

console.log(0 == false);  // true  ← perigoso!
console.log(0 === false); // false ← correto
console.log("5" == 5);    // true  ← perigoso!
console.log("5" === 5);   // false ← correto

Grave essa regra: === sempre.

if e else

A estrutura mais básica de decisão:

const hora = 14;

if (hora < 12) {
  console.log("Bom dia!");
} else {
  console.log("Boa tarde!");
}
// Resultado: "Boa tarde!"

O bloco dentro do if só executa se a condição for true. Caso contrário, o bloco do else é executado.

else if — múltiplas condições

Quando você tem mais de dois caminhos possíveis:

const hora = 20;

if (hora < 12) {
  console.log("Bom dia!");
} else if (hora < 18) {
  console.log("Boa tarde!");
} else {
  console.log("Boa noite!");
}
// Resultado: "Boa noite!"

O JavaScript testa cada condição de cima para baixo e executa apenas o primeiro bloco cuja condição seja verdadeira. Os demais são ignorados.

Operadores Lógicos

Você pode combinar condições usando os operadores lógicos:

const idade = 20;
const temCarteira = true;

// && (E) — ambas as condições precisam ser true
if (idade >= 18 && temCarteira) {
  console.log("Pode dirigir.");
}

// || (OU) — basta uma condição ser true
const temIngresso = false;
const eVIP = true;

if (temIngresso || eVIP) {
  console.log("Pode entrar no evento.");
}

// ! (NÃO) — inverte o valor booleano
const estaLogado = false;

if (!estaLogado) {
  console.log("Por favor, faça login.");
}

Exemplo prático: sistema de notas

const nota = 7.5;

if (nota >= 9) {
  console.log("Conceito A — Excelente!");
} else if (nota >= 7) {
  console.log("Conceito B — Bom!");
} else if (nota >= 5) {
  console.log("Conceito C — Regular.");
} else {
  console.log("Reprovado. Vamos tentar de novo.");
}
// Resultado: "Conceito B — Bom!"

Operador Ternário

Quando a condição é simples, existe uma forma mais curta de escrever um if/else. É chamado de operador ternário:

// Sintaxe: condição ? valorSeTrue : valorSeFalse

const idade = 20;
const acesso = idade >= 18 ? "Permitido" : "Negado";
console.log(acesso); // "Permitido"

// Equivale a:
// if (idade >= 18) {
//   acesso = "Permitido"
// } else {
//   acesso = "Negado"
// }

Use o ternário apenas para casos simples. Se a lógica for complexa, prefira o if/else tradicional — código legível vale mais do que código curto.

switch — quando há muitas opções fixas

O switch é ideal quando você precisa comparar uma variável com vários valores possíveis e específicos:

const diaDaSemana = 3;

switch (diaDaSemana) {
  case 1:
    console.log("Segunda-feira");
    break;
  case 2:
    console.log("Terça-feira");
    break;
  case 3:
    console.log("Quarta-feira");
    break;
  case 4:
    console.log("Quinta-feira");
    break;
  case 5:
    console.log("Sexta-feira");
    break;
  default:
    console.log("Final de semana!");
}
// Resultado: "Quarta-feira"

Nunca esqueça o break! Sem ele, o JavaScript continua executando os próximos case mesmo que a condição não corresponda — comportamento chamado de fall-through.

Você pode agrupar casos que compartilham o mesmo resultado:

const mes = 4;

switch (mes) {
  case 1:
  case 3:
  case 5:
  case 7:
  case 8:
  case 10:
  case 12:
    console.log("31 dias");
    break;
  case 4:
  case 6:
  case 9:
  case 11:
    console.log("30 dias");
    break;
  case 2:
    console.log("28 ou 29 dias");
    break;
}
// Resultado: "30 dias"

if vs switch — quando usar cada um?

Tarefa para você

Escreva um programa que receba a velocidade de um carro e exiba uma mensagem. Por exemplo velocidade = 95; aí:

• Se velocidade <= 60: "Dentro do limite." 
• Se velocidade <= 80: "Atenção: velocidade moderada." 
• Se velocidade <= 110: "Acima do limite permitido. Multa leve." 
• Se velocidade > 110: "Perigo! Multa grave."

Tente resolver antes de ver a resposta. Depois, modifique os valores e observe os resultados.

O === é a peça que mais economiza tempo aqui: comparar sem coerção elimina uma categoria inteira de surpresa, e o custo de digitar um caractere a mais é nenhum. O resto é escolha de forma — if e else if quando cada condição é uma pergunta diferente, o ternário quando a decisão cabe numa linha sem ficar ilegível, e o switch quando é sempre a mesma variável comparada contra uma lista de valores fixos.

Fontes e Referências

• MDN Web Docs — Condicionais: https://developer.mozilla.org/pt-BR/docs/Learn/JavaScript/Building_blocks/conditionals
• MDN Web Docs — Operadores de comparação: https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Operators
• JavaScript.info — Operadores lógicos: https://javascript.info/logical-operators
• JavaScript.info — Condicionais: https://javascript.info/ifelse
• Eloquent JavaScript, Cap. 2 — Marijn Haverbeke: https://eloquentjavascript.net/02_program_structure.html
• MDN — a instrução switch: https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Statements/switch

Resposta do exercício proposto:

const velocidade = 95;

if (velocidade <= 60) {
  console.log("Dentro do limite.");
} else if (velocidade <= 80) {
  console.log("Atenção: velocidade moderada.");
} else if (velocidade <= 110) {
  console.log("Acima do limite permitido. Multa leve.");
} else {
  console.log("Perigo! Multa grave.");
}

Exercícios

Exercício 1

Anote a saída exata de cada linha e explique, em uma frase, o que o == fez de diferente do ===.

console.log(0 == false);
console.log(0 === false);
console.log("5" == 5);
console.log("5" === 5);

Exercício 2

Alguém reordenou a cadeia de notas e agora todo aluno recebe "Conceito C". Rode mentalmente com nota = 9.5, diga o que sai e explique por quê.

const nota = 9.5;

if (nota >= 5) {
  console.log("Conceito C — Regular.");
} else if (nota >= 7) {
  console.log("Conceito B — Bom!");
} else if (nota >= 9) {
  console.log("Conceito A — Excelente!");
}

Exercício 3

Removeram o break de um dos casos. Com diaDaSemana = 3, quantas linhas o programa imprime, e quais?

const diaDaSemana = 3;

switch (diaDaSemana) {
  case 3:
    console.log("Quarta-feira");
  case 4:
    console.log("Quinta-feira");
    break;
  case 5:
    console.log("Sexta-feira");
    break;
}

Exercício 4

No switch de meses do artigo, que compara mes com 1 a 12, o que acontece se mes valer 13? E o que deveria ser acrescentado?

Exercício 5

Reescreva o if/else abaixo usando o operador ternário. Depois, diga um caso em que você não faria essa troca.

const idade = 20;
let acesso;

if (idade >= 18) {
  acesso = "Permitido";
} else {
  acesso = "Negado";
}