É fácil se sentir sobrecarregado pelas diferentes formas de abordar a tomada de decisão em seu código JavaScript, especialmente quando se trabalha com lógica condicional. Assim como muitos, você pode começar com declarações if...else.

No entanto, à medida que sua lógica se torna mais complexa, você descobrirá que a declaração switch em JavaScript é melhor para lidar com múltiplas condições de forma limpa e legível.

O que é um switch statement?

Um switch é um mecanismo de controle de fluxo que permite que seu programa execute diferentes blocos de código com base no valor de uma expressão. Funciona como um controlador de tráfego, direcionando o fluxo de execução para o bloco de código apropriado.

Sintaxe básica dos switch statements

Em JS, o switch avalia uma expressão uma vez e a compara com uma série de casos definidos. Cada caso corresponde a uma correspondência potencial e, se nenhum dos casos corresponder, um bloco default opcional pode ser usado.

switch (expression) { case value1: // Código a executar if expression === value1 break; case value2: // Código a executar if expression === value2 break; default: // Código a executar if no cases match }

Casos de uso para switch statements

Mapeando valores para ações

Um cenário comum é mapear valores de entrada para ações correspondentes, como em funções que lidam com input do usuário ou gerenciamento de estado em um jogo.

let direction = "left"; switch (direction) { case "up": console.log("Moving up"); break; case "down": console.log("Moving down"); break; case "left": console.log("Moving left"); break; case "right": console.log("Moving right"); break; default: console.log("Invalid direction"); }

Comportamento de queda nos switch statements

Um dos aspectos mais notáveis de um switch é o comportamento de queda. Sem um break, o código continua para o próximo caso. Isso pode ser útil, mas também pode levar a resultados indesejados.

let grade = "A"; switch (grade) { case "A": case "B": case "C": console.log("You passed!"); break; case "D": console.log("You barely passed..."); break; case "F": console.log("You failed."); break; default: console.log("Invalid grade"); }

Alternativas avançadas: Literais de objeto

Em vez de switch, literais de objeto podem simplificar o código e evitar armadilhas de queda. Eles são mais concisos e fáceis de estender.

const actions = { play: () => console.log("Playing the music"), pause: () => console.log("Pausing the music"), stop: () => console.log("Stopping the music"), rewind: () => console.log("Rewinding the music"), }; let command = "play"; actions[command] ? actions[command]() : console.log("Invalid command");

Essa abordagem é mais concisa e evita as armadilhas de queda.

Melhores práticas para usar switch statements

Inclua sempre um caso default, use break para evitar queda, mantenha o código legível e use valores de caso descritivos.

Armadilhas comuns dos switch cases e como evitá-las

Evite esquecer o break, o uso excessivo de switch e ignorar o caso default.

Conclusão

O switch em JS é uma adição valiosa à sua caixa de ferramentas JavaScript, oferecendo uma forma organizada de lidar com múltiplas condições. Use switch para simplificar sua estrutura de código e substitua cadeias complexas de if...else.