Estructura Switch — Fundamentos de JavaScript

• Estados de una orden
• ¿Qué es switch?
  • Ejemplo: convertir número a palabra
  • Ejemplo: identificar el tipo de usuario
• ¿Cuándo usar switch?

Cuando escribes un programa, a menudo necesitas que haga cosas diferentes según el valor de una variable. Por ejemplo:

• Si el usuario es administrador, mostrar todos los botones.
• Si el pedido ya fue pagado, mostrar un mensaje de confirmación.
• Si el número es 1, escribir "one".

Para eso, usamos estructuras condicionales como if...else. Pero cuando hay muchas opciones, switch es una forma más clara de escribirlo.

Estados de una orden

Imagina que trabajas en una tienda en línea. Cada pedido tiene un estado que indica qué está pasando:

const status = 'paid';

Queremos mostrar un mensaje distinto según ese estado. Con if...else, el código se ve así:

if (status === 'processing') {
  console.log('Procesando tu pedido...');
} else if (status === 'paid') {
  console.log('¡Gracias por tu pago!');
} else if (status === 'new') {
  console.log('Hemos recibido tu pedido.');
} else {
  console.log('Estado desconocido');
}

Es como si tuvieras un buzón de pedidos y al revisar uno, dices:

• “Ah, está en proceso, ¡vamos a prepararlo!”
• “Ya está pagado, ¡gracias!”
• “Es nuevo, avisemos al cliente.”

Cada estado tiene su reacción. Eso hace switch: abrir el buzón y reaccionar según lo que encuentra.

Funciona, pero si tenemos muchos estados, se vuelve difícil de leer. Aquí es donde switch nos ayuda a organizar mejor el código.

¿Qué es switch?

Así se ve el ejemplo anterior usando switch:

switch (status) {
  case 'processing':
    console.log('Procesando tu pedido...');
    break;
  case 'paid':
    console.log('¡Gracias por tu pago!');
    break;
  case 'new':
    console.log('Hemos recibido tu pedido.');
    break;
  default:
    console.log('Estado desconocido');
}

Esto hace lo mismo que el ejemplo con if, pero se ve más limpio.

¿Qué significa cada parte?

• switch Es la estructura general: abre la comparación.
• status Es la variable que estamos evaluando.
• case Es una opción que puede tener esa variable.
• break Detiene la ejecución para que no siga leyendo más casos.
• default Es lo que se ejecuta si no se cumple ningún case.

Y si olvido el break?

⛔ break significa “¡Detente aquí!” y evita que el programa siga ejecutando otros case. Si no colocamos break, la ejecución continuará automáticamente con el siguiente case, sin importar si su condición se cumple o no.

const status = 'processing';

switch (status) {
  case 'processing':
    console.log('Procesando...');
  case 'paid':
    console.log('Pagado');
  default:
    console.log('¿Qué está pasando?');
}

Salida

Procesando...
Pagado
¿Qué está pasando?

Como no pusimos break, el programa siguió ejecutando todos los casos desde el primero que coincidió. Esto se llama fall through (caída hacia abajo), y significa que el programa sigue ejecutando todos los bloques siguientes aunque no coincidan. Es como si te olvidaras de cerrar la puerta después de entrar.

Ejemplo: convertir número a palabra

Supón que tienes que mostrar el número ingresado como texto en inglés. Podrías hacerlo así:

const numberToWord = (count) => {
  switch (count) {
    case 1:
      return 'one';
    case 2:
      return 'two';
    case 3:
      return 'three';
    default:
      return 'unknown';
  }
};

console.log(numberToWord(2)); // "two"

💡 Aquí no usamos break porque cada return ya detiene la función.

Ejemplo: identificar el tipo de usuario

Supón que estás creando una app donde cada persona tiene un rol: 'admin', 'editor' o 'invitado'. Según su rol, puedes mostrarle diferentes mensajes.

const mostrarMensaje = (rol) => {
  switch (rol) {
    case 'admin':
      return 'Tienes acceso total';
    case 'editor':
      return 'Puedes editar contenido';
    case 'invitado':
      return 'Solo puedes ver contenido';
    default:
      return 'Rol no reconocido';
  }
};

console.log(mostrarMensaje('editor')); // "Puedes editar contenido"

Este tipo de lógica es muy común en sitios web, apps o juegos.

¿Cuándo usar switch?

• Si solo tienes una o dos condiciones, if está bien.
• Si estás comparando la misma variable contra varios valores posibles, switch es más ordenado.

Con esta herramienta, tu código será más claro y organizado cuando necesites evaluar distintos valores de una misma variable. Prueba cambiar los valores y agregar más case para ver qué pasa. ¡Experimentar es la mejor forma de aprender!

Materiales adicionales

1. Switch