Introducción a los casos de interruptores de JavaScript

Programación

En este breve artículo, le presentaré los casos de cambio de JavaScript y cómo usarlos con ejemplos prácticos.

Este artículo lo explicará mejor con ejemplos más prácticos para ayudarlo a comprender los casos de interruptores en profundidad.

Prerrequisitos.

  • Conocimientos básicos de JavaScript
  • Editor de código
  • Navegador web
  • Tu cerebro :)

Una switchdeclaración básicamente puede reemplazar múltiples ifcomprobaciones en JavaScript.

Ofrece una forma más descriptiva de comparar un valor con múltiples variantes.

La sintaxis de Switch

La switchplaca presenta uno o más casebloques y un caso por defecto opcional.

switch(x) { case 'value1': // if (x === 'value1') //code here [break] case 'value2': // if (x === 'value2') //code here [break] default: //code here [break] }
  • Se xverifica que el valor de sea ​​estrictamente igual al valor del primero case(es decir, value1) luego al segundo ( value2) y así sucesivamente.
  • Si se encuentra la igualdad, switchcomienza a ejecutar el código comenzando por el correspondiente case, hasta el más cercano break(o hasta el final de switch).
  • Si ningún caso coincide, defaultse ejecuta el código (si existe).

Algunos ejemplos reales

  • Interruptor simple de reproducción y pausa

La switchdeclaración se puede utilizar para varias ramas en función de un número o cadena:

switch (movie) { case 'play': playMovie(); break; case 'pause': pauseMovie(); break; default: doNothing(); }

Si no agrega una breakdeclaración, la ejecución "caerá" al siguiente nivel. Es esencial que etiquetes deliberadamente la caída con un comentario si realmente lo pretendías para ayudar a la depuración:

switch (movie) { case 'play': // fallthrough case 'pause': pauseMovie(); break; default: doNothing(); }

La cláusula predeterminada es opcional. Puede tener expresiones tanto en la parte del interruptor como en los casos si lo desea; las comparaciones se realizan entre los dos utilizando el ===operador:

switch (3 + 7) { case 5 + 5: correct(); break; default: neverhappens(); }
  • Interruptor de cálculo matemático simple
let average = 2 + 6; switch (average) { case 4: alert( 'Too small' ); break; case 8: alert( 'Exactly!' ); break; case 10: alert( 'Too large' ); break; default: alert( "Incorrect values!" ); }

Aquí se switchempieza a comparar average desde la primera casevariante que es 4. El partido falla.

Entonces 8. Eso es una coincidencia, por lo que la ejecución comienza case 8hasta el más cercano break.

Si no hay break, la ejecución continúa con la siguiente casesin ningún control.

Aquí hay un ejemplo sin break:

let average = 2 + 6; switch (average) { case 4: alert( 'Too small' ); case 8: alert( 'Exactly!' ); case 10: alert( 'Too big' ); default: alert( "Incorrect values!" ); }

En el ejemplo anterior, veremos la ejecución secuencial de tres alerts:

alert( 'Exactly!' ); alert( 'Too big' ); alert( "Incorrect values!" );
  • caso de cambio de método getDay ()

El getDay()método devuelve el día de la semana como un número entre 0 y 6.

Domingo = 0, lunes = 1, martes = 2, miércoles = 3, jueves = 4, viernes = 5, sábado = 6

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"; }

El resultado del día será el día de la semana actual en formato de día

PD: Esto cambiaría según el momento en que estés leyendo este artículo.

Escribí este artículo el 13/06/2019 que es un jueves, por lo que el resultado sería:

Thursday

La palabra clave predeterminada

La palabra clave predeterminada especifica el código que se ejecutará si no hay coincidencia de casos, más como una declaración else:

switch (new Date().getDay()) { case 6: text = "Today is Saturday"; break; case 0: text = "Today is Sunday"; break; default: text = "Its not weekend yet!"; }

El resultado del texto será:

Its not weekend yet!

El caso predeterminado no tiene que ser el último caso en un bloque de interruptores:

switch (new Date().getDay()) { default: text = "Its not weekend yet!"; break; case 6: text = "Today is Saturday"; break; case 0: text = "Today is Sunday"; }
Si el caso predeterminado no es el último en el bloque de interruptores, recuerde terminar el caso predeterminado con un descanso.

Conclusión

Hay tantos ejemplos prácticos de casos de interruptores que puede dirigirse a google.com y realizar una búsqueda rápida de más ejemplos de casos de interruptores.

Si este artículo te ayudó, muéstralo compartiéndolo.

¡Gracias por leer!