JavaScript switch case: Ejemplo de sentencias switch en JS

Artículo original escrito por: Jessica Wilkins
Artículo original: JavaScript Switch Case – JS Switch Statement Example
Traducido y adaptado por: Rafael D. Hernandez

Hay momentos en JavaScript en los que podrías considerar usar una sentencia switch en lugar de una sentencia if else.

Las sentencias switch pueden tener una sintaxis más limpia que las sentencias if else complicadas.

Eche un vistazo al ejemplo a continuación: en lugar de usar esta sentencia larga if else, puedes optar por una sentencia switch más fácil de leer.

const mascota = "perro";

if (mascota === "lagarto") {
  console.log("Tengo un lagarto");
} else if (mascota === "perro") {
  console.log("Tengo un perro");
} else if (mascota === "gato") {
  console.log("Tengo un gato");
} else if (mascota === "serpiente") {
  console.log("Tengo una serpiente");
} else if (mascota === "loro") {
  console.log("Tengo un parrot");
} else {
  console.log("No tengo mascota");
}

const mascota = "perro";
 
switch (mascota) {
  case "lagarto":
    console.log("Tengo un lagarto");
    break;
  case "perro":
    console.log("Tengo un perro");
    break;
  case "gato":
    console.log("Tengo un gato");
    break;
  case "serpiente":
    console.log("Tengo una serpiente");
    break;
  case "loro":
    console.log("Tengo un loro");
    break;
  default:
    console.log("No tengo mascota");
    break;
}

En este artículo, explicaré qué son las sentencias switch y cómo funcionan. También te ayudaré a averiguar si son una buena opción para usar en tu código.

¿Qué es una sentencia switch?

En programación, una sentencia switch es una instrucción de flujo de control que prueba el valor de una expresión expression contra varios casos.

Esta es la sintaxis básica para una instrucción switch:

switch (expresion) {
  case 1:
   //este código se ejecutará si el caso coincide con la expresión
    break;
  case 2:
   //este código se ejecutará si el caso coincide con la expresión
    break;
  case 3:
   //este código se ejecutará si el caso coincide con la expresión
    break;
  default:
    //este código se ejecutará si ninguno de los casos coincide con la expresión
    break;
}

La computadora revisará la sentencia switch y verificará la igualdad estricta === entre el caso case y la expresión expression.  Si uno de los casos coincide con la expresión expression, se ejecutará el código dentro de la cláusula del caso case.

switch (expresion) {
  case 1:
   //este código se ejecutará si el caso coincide con la expresión
    break;
  case 2:
   //este código se ejecutará si el caso coincide con la expresión
    break;
}

Si ninguno de los casos coincide con la expresión, se ejecutará la cláusula predeterminada default.

  default:
    //este código se ejecutará si ninguno de los casos coincide con la expresión
    break;

Si los casos múltiples coinciden con la instrucción switch, se utilizará el primer caso case que coincida con la expresión expression.

Las instrucciones break se desprenderán del interruptor switch cuando el caso case coincida. Si las sentencias break no están presentes, el equipo continuará a través de las sentencias switch incluso si se encuentra una coincidencia.

Si las sentencias return están presentes en el switch, no necesita una sentencia break.

Ejemplo de sentencias switch en JavaScript

En este ejemplo, estamos comparando "oboe" con los casos. "oboe" coincidiría con la cláusula del tercer case e imprimiría en la consola "Toco el oboe".

switch ("oboe") {
  case "trompeta":
    console.log("Toco la trompeta");
    break;
  case "flauta":
    console.log("Toco la flauta");
    break;
  case "oboe":
    console.log("Toco el oboe");
    break;
  default:
    console.log("No toco un instrumento. Lo siento");
    break;
}

Si cambiaras la expresión a "sin instrumento", la cláusula predeterminada default se ejecutaría y el mensaje impreso en la consola sería "No toco un instrumento. Lo siento".

switch ("sin instrumento") {
  case "trompeta":
    console.log("I play the trumpet");
    break;
  case "flauta":
    console.log("Toco la flauta");
    break;
  case "oboe":
    console.log("Toco el oboe");
    break;
  default:
    console.log("No toco un instrumento. Lo siento");
    break;
}

Sentencias de break faltantes

En este ejemplo, la coincidencia sería el case 2. Pero sin una sentencia break, la computadora continuará en el case 3 y la cláusula default.

Debes ver las tres sentencias de console.log porque no se incluyó una sentencia break.

switch (2) {
  case 1:
    console.log("El numero 1 fue elegido");
  case 2:
    console.log("El numero 2 fue elegido");
  case 3:
    console.log("El numero 3 fue elegido");
  default:
    console.log("No se eligió ningún número");
}

Dónde colocar la cláusula default

La convención estándar es colocar default como la última cláusula. Pero también se puede colocar antes que otros casos.

const comida = "nuez";

switch (comida) {
  case "pastel":
    console.log("Me gusta el pastel");
    break;
  case "pizza":
    console.log("Me gusta la pizza");
    break;
  default:
    console.log("Me gustan todos los alimentos");
    break;
  case "helado":
    console.log("Me gusta el helado");
    break;
}

La computadora todavía revisará cada uno de los casos y encontrará una coincidencia. Dado que la variable food no coincide con ninguno de los casos, se ejecutará el caso default.

Múltiples casos para una operación

Puede haber ocasiones en las que tenga una operación que será la misma para varios casos.

En lugar de escribir la misma console.log para cada caso, podemos omitir las sentencias break y colocar una operación singular después del grupo de casos.

El mensaje: "Este pais esta en Europa."se imprimirá en la consola si pais coincide con cualquiera de los casos de "Francia", "Espana", "Irlanda" o "Polonia".

const country = "Irlanda";
switch (pais) {
  case "Francia":
  case "Espana":
  case "Irlanda":
  case "Polonia":
    console.log("Este pais esta en Europa.");
    break;
  case "Estados Unidos":
  default:
    console.log("Este pais no esta en Europa.");
}

Sentencias de alcance de bloque y switch

Este ejemplo producirá un mensaje de error, porque la variable de mensaje ya ha sido declarada y no puede tener el mismo nombre de variable en el mismo ámbito de bloque.

const mandado = "Ir de Compras";
switch (mandado) {
  case "Ir al Dentista":
    let mensaje = "Odio ir al dentista";
    console.log(mensaje);
    break;
  case "Ir de Compras":
    let mensaje = "Me encanta ir de compras";
    console.log(mensaje);
    break;
  default:
    console.log("Sin mandados");
    break;
}

Para deshacerse de ese mensaje de error, los casos deben estar envueltos en un juego de llaves.

const mandado = "Ir de Compras";
switch (mandado) {
  case "Ir al Dentista": {
    let mensaje = "Odio ir al dentista";
    console.log(mensaje);
    break;
  }
  case "Going Shopping": {
    let mensaje = "I love to shop";
    console.log(mensaje);
    break;
  }
  default: {
    console.log("Sin mandados");
    break;
  }
}

Conclusion

El uso de una sentencia switch puede ser una alternativa a una sentencia if else. Una sentencia switch compara el valor de una expresión expression con varios casos.

Las sentencias de switch verificarán la igualdad estricta. En este ejemplo, desde "2"!= = 2, se ejecutará la cláusula default.

switch (2) {
  case "2":
    console.log("Número 2 en una cadena");
    break;
  case "3":
    console.log("Número 3 en una cadena");
    break;
  default:
    console.log("Número no presente");
    break;
}

Las sentencias break se desprenderán del switch cuando el case coincida. Si las sentencias break no están presentes, la computadora continuará a través de la sentencia switch incluso si se encuentra una coincidencia.

Espero que hayas disfrutado de este artículo sobre las sentencias switch.