Switch Case em JavaScript – Acabe com IFs Seguidos no Código
Aprenda como usar Switch Case em JavaScript e eliminar a repetição de if e else no seu código!
Caso prefira esse conteúdo no formato de vídeo-aula, assista ao vídeo abaixo ou acesse o nosso canal do YouTube!
Switch Case em JavaScript – Acabe com IFs Seguidos no Código
Na aula de hoje, vou te ensinar como usar switch case em JavaScript para eliminar a repetição de inúmeros if-else em seu código. Você aprenderá como implementá-lo para tornar seu código mais limpo, legível e agradável, mantendo a lógica intacta.
O switch case em JavaScript desempenha um papel fundamental na qualidade e na manutenção do seu código, tornando-o mais compreensível para outros desenvolvedores que possam examiná-lo.
Essa estrutura é extremamente eficaz para lidar com variáveis que podem assumir valores diferentes no seu código e, com base nesses valores, executar blocos de código distintos, produzindo respostas diferentes.
Vamos ver como o switch case JavaScript funciona e como você pode aprimorar seus códigos com essa funcionalidade.
Apresentando o Código Inicial
Para ilustrar como é possível otimizar um código utilizando a estrutura do switch case, vamos pegar o código abaixo como exemplo:
const disciplina = "JavaScript";
if (disciplina ==="Excel") {
console.log("Esse é um aluno impressionador de Excel da Hashtag!");
} else if (disciplina ==="Power BI") {
console.log("Esse é um aluno impressionador de Power BI da Hashtag!");
} else if (disciplina ==="PowerPoint") {
console.log("Esse é um aluno impressionador de PowerPoint da Hashtag!");
} else if (disciplina ==="Python") {
console.log("Esse é um aluno impressionador de Python da Hashtag!");
} else if (disciplina ==="Html/CSS") {
console.log("Esse é um aluno impressionador de Html/CSS da Hashtag!");
} else if (disciplina ==="VBA") {
console.log("Esse é um aluno impressionador de VBA da Hashtag!");
} else if (disciplina ==="SQL") {
console.log("Esse é um aluno impressionador de SQL da Hashtag!");
} else if (disciplina ==="JavaScript") {
console.log("Esse é um aluno impressionador de JavaScript da Hashtag!");
} else {
console.log("Esse não é um aluno da Hashtag!");
}Nesse código, verificamos o valor da variável através de uma série de if e else. Quando encontramos uma correspondência, exibimos a mensagem correspondente na tela.
O valor dessa variável pode ser definido de várias maneiras, mas, para simplificar o nosso exemplo, vamos alterá-lo diretamente no código manualmente.
Repare que ela começa com o valor de JavaScript, e ao executarmos o código, receberemos a mensagem abaixo:
Se alterarmos o valor da variável, a resposta obtida também será diferente. Vamos trocar o valor para Python:
Como você pode ver, o código funciona corretamente. No entanto, observe a quantidade de if e else que temos nele. Para esses casos, podemos utilizar a estrutura do switch case.
Como Usar Switch Case em JavaScript
O switch case em JavaScript é uma estrutura de controle muito útil quando estamos trabalhando com uma variável que pode assumir diferentes valores possíveis e, a partir desses valores, executar diferentes blocos de código correspondentes.
Como no nosso exemplo acima, a partir do valor da variável disciplina, diferentes blocos de códigos são executados, retornando respostas diferentes sobre o curso do aluno.
Para obtermos um resultado como o do código acima, começaremos com a palavra chave switch(), onde, dentro dos parênteses, passaremos a variável que queremos manipular, que no nosso caso é a variável disciplina.
JavaScript ImpressionadorComo usar JavaScript em qualquer empresa e qualquer área, com exemplos totalmente aplicados à realidade do Mercado de Trabalho, seja para se tornar um Desenvolvedor Front End, Backend, Full Stack ou Mobile.
Começar agora
Em seguida, atribuiremos os casos (case) e as respostas, ou seja, os blocos de código que devem ser executados para cada variável.
Nosso código ficará assim:
const disciplina = "Python";
switch(disciplina) {
case "Excel":
console.log("Esse é um aluno impressionador de Excel da Hashtag!");
case "Power BI":
console.log("Esse é um aluno impressionador de Power BI da Hashtag!");
case "PowerPoint":
console.log("Esse é um aluno impressionador de PowerPoint da Hashtag!");
case "Python":
console.log("Esse é um aluno impressionador de Python da Hashtag!");
case "Html/CSS":
console.log("Esse é um aluno impressionador de Html/CSS da Hashtag!");
case "VBA":
console.log("Esse é um aluno impressionador de VBA da Hashtag!");
case "SQL":
console.log("Esse é um aluno impressionador de SQL da Hashtag!");
case "JavaScript":
console.log("Esse é um aluno impressionador de JavaScript da Hashtag!");
}Perceba que a estrutura dele está bem semelhante ao código anterior. Porém, ele ainda não está completo. Se você o executar dessa forma, irá receber a seguinte resposta:
Isso ocorre porque o switch case em JavaScript não termina automaticamente após encontrar uma correspondência, a menos que você inclua uma instrução break para cada caso.
Sem essa instrução, ele continuará executando todos os outros blocos de código abaixo da correspondência encontrada.
Além disso, no nosso código, não temos uma resposta padrão para quando a disciplina inserida não corresponder a nenhum dos casos. Se você voltar a analisar o código que tínhamos com if-else, verá que temos a resposta: “Esse não é um aluno da Hashtag!”.
Para incluirmos isso dentro da estrutura do switch case, precisamos adicionar a instrução default, que é uma condição padrão, um bloco de código que será executado caso nenhuma das outras opções seja correspondida.
O resultado final do nosso código ficará:
const disciplina = "Python";
switch(disciplina) {
case "Excel":
console.log("Esse é um aluno impressionador de Excel da Hashtag!");
break;
case "Power BI":
console.log("Esse é um aluno impressionador de Power BI da Hashtag!");
break;
case "PowerPoint":
console.log("Esse é um aluno impressionador de PowerPoint da Hashtag!");
break;
case "Python":
console.log("Esse é um aluno impressionador de Python da Hashtag!");
break;
case "Html/CSS":
console.log("Esse é um aluno impressionador de Html/CSS da Hashtag!");
break;
case "VBA":
console.log("Esse é um aluno impressionador de VBA da Hashtag!");
break;
case "SQL":
console.log("Esse é um aluno impressionador de SQL da Hashtag!");
break;
case "JavaScript":
console.log("Esse é um aluno impressionador de JavaScript da Hashtag!");
break;
default:
console.log("Esse não é um aluno da Hashtag!");
}No caso do default, não precisamos da instrução break, pois não há mais blocos de código dentro do nosso switch.
Conclusão – Switch Case em JavaScript
Nessa aula você aprendeu como usar switch case em JavaScript para eliminar a repetição de blocos if-else no seu código.
Te mostrei como aplicar essa estrutura para tornar seu código mais claro, legível e agradável, ao mesmo tempo que preserva toda a lógica. Facilitando a leitura por outros desenvolvedores.
Ao adotar o switch case em JavaScript, você conseguirá simplificar seus códigos, aprimorá-los e torná-los mais eficientes.
Hashtag Treinamentos
Para acessar publicações de JavaScript, clique aqui!
Posts mais recentes de JavaScript
- Try Catch no JavaScript: Programação Defensiva na Prática
Aprenda a usar try catch no JavaScript e melhore a sua programação defensiva! - ExpressJS: Crie APIs de forma rápida e prática com JavaScript
O ExpressJS simplifica a criação de APIs com JavaScript e Node.js. Aprenda passo a passo a montar seu backend com rotas, testes e um exemplo prático de controle de estoque. - Método forEach no JavaScript: automatize tarefas repetitivas
Aprenda como usar o Método forEach no JavaScript para automatizar tarefas repetitivas e gerar tabelas dinâmicas de forma prática e eficiente.
Posts mais recentes da Hashtag Treinamentos
- Planilha de Controle de Notas Fiscais no Excel [Grátis]
Baixe a planilha de controle de notas fiscais no Excel grátis: calcule ISS e retenções, veja o que está em aberto e gere a cobrança de cada nota de serviço. - Qual IA usar na empresa: ChatGPT, Claude ou Perplexity?
Qual IA usar na empresa: veja as diferenças entre ChatGPT, Claude e Perplexity e quando cada um rende mais em cada área da sua equipe. - Apostilas Gratuitas em PDF: Excel, Power BI, Python e IA
Baixe apostilas gratuitas em PDF de Excel, Power BI, Python, Claude e agentes de IA, com exercícios e gabarito. Escolha a sua e comece hoje.
