Tracks
/
JavaScript
JavaScript
/
Temario
/
Instrucción switch
In

Instrucción switch en JavaScript

4 ejercicios

Acerca de Instrucción switch

Sintaxis general

Además del condicional, JavaScript también tiene la instrucción switch, que permite ejecutar lógica de forma condicional. Se usa cuando una misma variable debe compararse con varias variantes. La comparación se hace comprobando la igualdad estricta (===); consulta el concepto de comparación. Para una variable x, la instrucción switch de JavaScript tiene la siguiente sintaxis.

switch (x) {
  case option1:
    // code that is executed when "x === option1" is true
    break;
  case option2:
    // code that is executed when "x === option2" is true
    break;
  default:
    // code that is executed when x does not equal any of the
    // options
}

El caso default es opcional y se usa por si quieres ejecutar algún código cuando ninguna de las otras opciones coincide con la variable.

Ejecución en cascada por defecto

Las instrucciones break anteriores son necesarias porque, por defecto, en JavaScript todos los casos se ejecutan en cascada. Eso significa que, sin ninguna instrucción break, se ejecutaría todo el código de los casos que hay debajo de la primera opción coincidente, aunque x no coincida con esas opciones. Este comportamiento de ejecución en cascada por defecto es una trampa habitual cuando se usa switch en JavaScript. Dentro de una función, también se puede usar return en lugar de break para evitar este problema.

Puedes aprovechar el comportamiento de ejecución en cascada cuando quieras aplicar el mismo código a varios casos. Puedes encontrar un ejemplo de esto en la documentación de MDN.

Scope

Por defecto, las variables de las distintas instrucciones case comparten el mismo scope. Esto puede provocar un comportamiento inesperado. Por ejemplo, si copias y pegas un caso, puedes acabar con una declaración let message en dos casos, lo que provoca un error; consulta la documentación de MDN. Para evitar problemas por compartir el scope, puedes crear un scope independiente para cada caso añadiendo un bloque de código con llaves para cada caso.

switch (x) {
  case option1: {
    // Variables declared here are contained to this case.
    break;
  }
  case option2: {
    // ...
    break;
  }
  default: {
    // ...
  }
}

Uso de expresiones

En lugar de una variable x, también puedes usar una expresión. Esa expresión se evalúa una sola vez al principio de la instrucción switch y el resultado se compara con los casos. Un uso habitual de esto es el «switch de tipos», que ejecuta código distinto según el tipo de una variable.

switch (typeof x) {
  case 'string':
    // code that is executed when x is a string
    break;
  case 'number':
    // code that is executed when x is a number
    break;
  default:
    // code that is executed when x has some other type
}

Las opciones también pueden ser expresiones.

Editar en GitHub El enlace se abre en una nueva ventana o pestaña

Aprende Instrucción switch