Declaración Javascript switch

La declaración switch es utilizada para realizar distintas acciones basadas en diferentes condiciones.

La declaración switch

Utiliza la instrucción switch para seleccionar uno de los muchos bloques de código que se ejecutarán.

Sintaxis

switch(expression) {
  case x:
    // code block
    break;
  case y:
    // code block
    break;
  default:
    // code block
}

Así es como funciona:

  • La expresión de cambio se evalúa una vez.
  • El valor de la expresión se compara con los valores de cada caso.
  • Si hay una coincidencia, se ejecuta el bloque de código asociado.
  • Si no hay coincidencia, se ejecuta el bloque de código predeterminado.

Ejm

El método getDay() devuelve el día de la semana como un número entre 0 y 6. (Domingo = 0, Lunes = 1, Martes = 2 ..). Este ejemplo utiliza el número del día de la semana para calcular el nombre del día de la semana.

switch (new Date().getDay()) {
  case 0:
    day = "Sunday";
    break;
  case 1:
    day = "Monday";
    break;
  case 2:
     day = "Tuesday";
    break;
  case 3:
    day = "Wednesday";
    break;
  case 4:
    day = "Thursday";
    break;
  case 5:
    day = "Friday";
    break;
  case 6:
    day = "Saturday";
}

La palabra reservada break

Cuando JavaScript alcanza una palabra clave switch, sale del bloque de cambio. Esto detendrá la ejecución de inside the block. No es necesario romper el último caso en un bloque switch. El bloque se rompe (termina) allí de todos modos.

Nota: Si omite la instrucción break, se ejecutará el siguiente caso incluso si la evaluación no coincide con el caso.

La palabra reservada default

La palabra clave default especifica el código que se ejecutará si no hay coincidencia de casos.

Ejm

El método getDay() devuelve el día de la semana como un número entre 0 y 6. Si hoy no es sábado (6) ni domingo (0), escriba un mensaje predeterminado:

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript switch</h2>

<p id="demo"></p>

<script>
var text;
switch (new Date().getDay()) {
case 6:
text = "Today is Saturday";
break;
case 0:
text = "Today is Sunday";
break;
default:
text = "Looking forward to the Weekend";
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

El caso default no tiene que ser el último caso en un bloque switch.

Ejm

switch (new Date().getDay()) {
  default:
    text = "Looking forward to the Weekend";
    break;
  case 6:
    text = "Today is Saturday";
    break;
  case 0:
    text = "Today is Sunday";
}

Si el caso default no es el último caso en el bloque switch, recuerda terminar el caso predeterminado con un break.

Bloques de código común

A veces querrá que diferentes casos break que usen el mismo código.

En este caso de ejemplo, 4 y 5 comparten el mismo bloque de código, y 0 y 6 comparten otro bloque de código.

Ejm

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript switch</h2>

<p id="demo"></p>

<script>
var text;
switch (new Date().getDay()) {
case 4:
case 5:
text = "Soon it is Weekend";
break;
case 0:
case 6:
text = "It is Weekend";
break;
default:
text = "Looking forward to the Weekend";
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

Detalles de cambio

Si varios casos coinciden con un valor de caso, se selecciona el primer caso. Si no se encuentran casos coincidentes, el programa continúa con la etiqueta predeterminada. Si no se encuentra una etiqueta predeterminada, el programa continúa con las declaraciones después del cambio.

Comparación estricta

Los casos de cambio usan una comparación estricta (===). Los valores deben ser del mismo tipo para coincidir. Una comparación estricta solo puede ser cierta si los operandos son del mismo tipo. En este ejemplo, no habrá ninguna coincidencia para x.

Ejm

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript switch</h2>

<p id="demo"></p>

<script>
var x = "0";

switch (x) {
case 0:
text = "Off";
break;
case 1:
text = "On";
break;
default:
text = "No value found";
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>