Cambiar varios casos en Javascript

1. Switch con múltiples casos en Javascript usando Fall Through Model
2. Manejo de varios casos en Switch usando expresiones matemáticas en JavaScript
3. Manejo de múltiples casos en Switch usando expresiones de cadena en Javascript
4. Manejo de múltiples casos en Switch usando expresiones lógicas en Javascript

Los casos de interruptores son mucho más eficaces que la escalera if-else. Tienen un mapa directo de valores de una variable, en el bloque switch(variable), a sus valores correspondientes, en el bloque case: value. Estamos familiarizados con el uso habitual de switch-case con un mapa de valor único, pero ¿puede admitir varios casos? Veamos algunas formas, en javascript, en las que podemos tener varios casos en el bloque switch-case.

Switch con múltiples casos en Javascript usando Fall Through Model

El modelo Fall through es un primer paso para admitir switch con más de un bloque case en javascript. Aquí, capturamos múltiples valores de la variable conmutada a través de múltiples casos. Aplicamos la palabra clave break para un conjunto de casos válidos. Por ejemplo, si queremos registrar el nombre del trimestre de un año en función del mes transcurrido, asignaremos los índices del mes en función del trimestre. Consulte el siguiente código.

window.onload =
    function() {
  findQuarter('2021-08-08');
  findQuarter('2021-05-12');
  findQuarter('2021-02-28');
  findQuarter('2021-11-30');
}

function findQuarter(dateString) {
  var monthIndex = new Date(dateString).getMonth();
  switch (monthIndex) {
    case 0:
    case 1:
    case 2:
      console.log('First Quarter');
      break;
    case 3:
    case 4:
    case 5:
      console.log('Second Quarter');
      break;
    case 6:
    case 7:
    case 8:
      console.log('Third Quarter');
      break;
    case 9:
    case 10:
    case 11:
      console.log('Fourth Quarter');
      break;
  }
}

Producción :

Third Quarter
Second Quarter
First Quarter
Fourth Quarter

La función findQuarter() acepta una cadena de fecha en formato aaaa-mm-dd. Luego extrae el índice del mes del argumento dateString convirtiéndolo primero en un objeto de fecha de JavaScript y luego obteniendo el índice de mes del objeto de fecha. getMonth() es una función de JavaScript que se aplica a un objeto Date y devuelve el índice del mes a partir de 0. Usamos varios casos aquí, apilados uno debajo del otro para capturar múltiples valores para la salida.

Por ejemplo, para los meses de enero a marzo, los índices mensuales respectivos variarán de 0 a 2 según la salida devuelta por la función getMonth(). Apilamos todos los casos de 0 a 2 sin la palabra clave break. Por lo tanto, tropiezan y romperán el switch-case al encontrar el break que pasa a estar en la línea del caso 2: donde registra el valor Primer trimestre. Este conjunto de códigos parece abultado. Podemos reescribir lo mismo de la siguiente manera para reducir el número de líneas.

window.onload =
    function() {
  findQuarter('2021-08-08');
  findQuarter('2021-05-12');
  findQuarter('2021-02-28');
  findQuarter('2021-11-30');
}

function findQuarter(dateString) {
  var monthIndex = new Date(dateString).getMonth();
  switch (monthIndex) {
    case 0:
    case 1:
    case 2:
      console.log('First Quarter');
      break;
    case 3:
    case 4:
    case 5:
      console.log('Second Quarter');
      break;
    case 6:
    case 7:
    case 8:
      console.log('Third Quarter');
      break;
    case 9:
    case 10:
    case 11:
      console.log('Fourth Quarter');
      break;
  }
}

Producción :

Third Quarter
Second Quarter
First Quarter
Fourth Quarter

Tenga en cuenta que aquí la salida sigue siendo la misma. Es simplemente otra forma de escribir el modelo Fall through switch-case. Hace que el código ahora se vea más limpio y ahorra espacio.

Manejo de varios casos en Switch usando expresiones matemáticas en JavaScript

Estamos tratando con valores numéricos de un mes según el ejemplo mencionado en la sección anterior. ¿Podemos utilizar expresiones en bloques case? ¡Definitivamente sí! Consultemos el siguiente código antes de explicar el funcionamiento.

window.onload =
    function() {
  findQuarter('2021-08-08');
  findQuarter('2021-05-12');
  findQuarter('2021-02-28');
  findQuarter('2021-11-30');
  findQuarter('2021-2-30');
}

function findQuarter(dateString) {
  var monthIndex = new Date(dateString).getMonth();
  switch (monthIndex) {
        case ( (monthIndex < 2) ? monthIndex : -1 ):
            console.log('First Quarter');
          break;
        case ( ((monthIndex > 2) && (monthIndex < 5)) ?  monthIndex : -1):
            console.log('Second Quarter');
          break;
        case ( ((monthIndex > 5) && (monthIndex < 8)) ?  monthIndex : -1):
            console.log('Third Quarter');
          break;
        case ( ((monthIndex > 8) && (monthIndex < 11)) ?  monthIndex : -1):
            console.log('Fourth Quarter');
          break;
        default:
          console.log('Invalid date');
          break;
  }
}

Producción :

Third Quarter
Second Quarter
First Quarter
Fourth Quarter

Si usamos expresiones en el caso del interruptor, deben devolver un valor numérico en caso contrario -1. En el fragmento de código anterior, hemos agregado expresiones numéricas en el bloque case en lugar de sus valores reales. Estas expresiones evalúan el trimestre correspondiente del mes y registran el nombre del trimestre. Aquí, hemos incluido la cláusula default en el switch case para manejar la Invalid date. El método getMonth() en javascript devuelve un valor (entre 0 y 11) si el month en date es válido (dentro del rango de 1 a 12) de lo contrario, devolverá NaN. El bloque default detectará estos escenarios de fechas no válidas.

Manejo de múltiples casos en Switch usando expresiones de cadena en Javascript

También podemos usar expresiones de cadena dentro del bloque case. Estas expresiones se evalúan en tiempo de ejecución, ejecutando la cláusula case. Para nuestro ejemplo de mes, intentemos cambiar el nombre del mes. Para ello, aplicaremos la función toLocaleDateString() en el objeto de fecha. En el parámetro de opciones de la función, damos { month: 'long' }. La salida para toLocaleDateString('en-US', { month: 'long' }) ahora será un nombre de mes, el nombre completo del mes. Luego cambiamos la salida del nombre del mes completo de la función toLocaleDateString('en-US', { month: 'long' }).

window.onload =
    function() {
  findQuarter('2021-08-08');
  findQuarter('2021-05-12');
  findQuarter('2021-02-28');
  findQuarter('2021-11-30');
  findQuarter('2021-21-30');
}

function findQuarter(dateString) {
  var monthName =
      new Date(dateString).toLocaleDateString('en-US', {month: 'long'});
  switch (true) {
    case['January', 'February', 'March'].includes(monthName):
      console.log('First Quarter');
      break;
    case['April', 'May', 'June'].includes(monthName):
      console.log('Second Quarter');
      break;
    case['July', 'August', 'September'].includes(monthName):
      console.log('Third Quarter');
      break;
    case['October', 'November', 'December'].includes(monthName):
      console.log('Fourth Quarter');
      break;
    default:
      console.log('Invalid date');
      break;
  }
}

Producción :

Third Quarter
Second Quarter
First Quarter
Fourth Quarter
Invalid date

En el código anterior, hemos utilizado la declaración switch(true). En la cláusula case, tenemos la comparación de cadenas. Creamos un array temporal de meses para cada trimestre y los agregamos a cad case. Lu case rificamos si el monthName está disponible en el array de trimestres. Si lo encuentra, registrará el nombre del trimestre. Si la fecha no es válida, la función toLocaleDateString('en-US', { month: 'long' }) generará Invalid Date. Este escenario está atrapado por el bloque default ya que la cadena Invalid Date no coincidirá con los arrays predefinidas que contienen los nombres de los meses en un trimestre. Por lo tanto, manejamos el escenario de fecha inválida sin problemas aquí.

Manejo de múltiples casos en Switch usando expresiones lógicas en Javascript

Como vimos en las expresiones matemáticas y de cadena, también podemos utilizar operadores lógicos en casos múltiples en el bloque switch-case. En el ejemplo del mes, usaremos el operador lógico OR || para decidir si el nombre del mes pertenece a un trimestre en particular. Consultemos el siguiente código.

window.onload =
    function() {
  findQuarter('2021-08-08');
  findQuarter('2021-05-12');
  findQuarter('2021-02-28');
  findQuarter('2021-11-30');
  findQuarter('2021-21-30');
}

function findQuarter(dateString) {
  var monthName =
      new Date(dateString).toLocaleDateString('en-US', {month: 'long'});
  switch (true) {
    case (
        monthName === 'January' || monthName === 'February' ||
        monthName === 'March'):
      console.log('First Quarter');
      break;
    case (monthName === 'April' || monthName === 'May' || monthName === 'June'):
      console.log('Second Quarter');
      break;
    case (
        monthName === 'July' || monthName === 'August' ||
        monthName === 'September'):
      console.log('Third Quarter');
      break;
    case (
        monthName === 'October' || monthName === 'November' ||
        monthName === 'December'):
      console.log('Fourth Quarter');
      break;
    default:
      console.log('Invalid date');
      break;
  }
}

Producción :

Third Quarter
Second Quarter
First Quarter
Fourth Quarter
Invalid date

En el código, verificamos si el valor de monthName es igual al mes de un trimestre. En consecuencia, consolamos el nombre del barrio. Aquí también, manejamos el caso de fecha inválida ya que no cumplirá ninguna de las condiciones codificadas en la cláusul case y caerá en el bloque default, que luego imprime Invalid date en la consola del navegador.