Cargando...

Instrucción switch

if / else brilla cuando la pregunta es sí/no o un rango. A veces la pregunta es otra: ¿cuál de varios valores fijos es? Código de día 1…7, estado "ok" / "warn" / "err", clave de menú. Para esa forma, switch es la herramienta limpia. Ya sabes ramificar; aquí emparejas un valor con varios case etiquetados.

¿Qué hace switch?

switch mira una expresión entre paréntesis. Compara ese valor con cada etiqueta case. Si coincide, ejecuta las sentencias de ese camino. break sale del switch para que no corran los siguientes. default es el respaldo cuando ninguno coincidió.

Las piezas de un vistazo

📊 Piezas cotidianas de switch

Palabra clave Lectura cotidiana Uso típico
switch mira este valor… abrir la elección
case si es igual a esta etiqueta… una opción fija
break para aquí; sal del switch terminar tras coincidir
default si nada coincidió… camino de respaldo

La coincidencia es de igualdad estricta (idea de ===). Un case numérico no coincide con una cadena de dígitos. Mantén valor y etiquetas con la misma forma.

switch simple

javascript 
let day = 3;
switch (day) {
case 1:
console.log("Mon");
break;
case 2:
console.log("Tue");
break;
case 3:
console.log("Wed");
break;
default:
console.log("other");
}

Un valor, varios caminos etiquetados

Aquí day es 3, así que corre el camino case 3 y la Consola imprime Wed. Se revisaron y saltaron los cases 1 y 2. Tras break el switch termina — default no corre.

Sin break, JavaScript seguiría entrando en los cuerpos de los siguientes cases. Eso se llama fall-through. Quien empieza casi siempre quiere un break tras cada case terminado.

Por qué importa break

javascript 
let day = 2;
switch (day) {
case 1:
console.log("Mon");
case 2:
console.log("Tue");
case 3:
console.log("Wed");
break;
default:
console.log("other");
}

Sin break también corren los cases siguientes

day es 2. La coincidencia empieza en case 2, imprime Tue, sigue a case 3 e imprime Wed antes del break. Querías una etiqueta; obtuviste dos. Pon break bajo cada case terminado salvo que compartas código a propósito.

default cuando nada coincide

javascript 
let day = 9;
switch (day) {
case 1:
console.log("Mon");
break;
case 2:
console.log("Tue");
break;
default:
console.log("other");
}

default cubre «ninguno de estos»

day es 9. Ningún case coincide, así que corre default y ves other. Usa default cuando todo valor inesperado aún necesita un mensaje seguro. Omítelo solo si el silencio es aceptable.

Cases de cadena

javascript 
let status = "warn";
switch (status) {
case "ok":
console.log("green");
break;
case "warn":
console.log("yellow");
break;
case "err":
console.log("red");
break;
default:
console.log("unknown");
}

Los cases también pueden ser cadenas

status es "warn", así que ves yellow. Los cases de cadena son comunes para códigos cortos de un formulario o API. Rangos como «nota de 60 a 90» siguen siendo de if / else if — switch quiere etiquetas discretas.

Guardar la etiqueta elegida

javascript 
let day = 1;
let label;
switch (day) {
case 1:
label = "Mon";
break;
case 2:
label = "Tue";
break;
default:
label = "other";
}
console.log(label);

Nombra el resultado de la coincidencia

Asigna label dentro de cada case (y en default), luego úsalo una vez después. Aquí label pasa a ser "Mon". El mismo patrón que con if / else — primero eliges, luego usas.

Muestra el camino elegido en la página

Crea un mensaje corto con switch y escríbelo en la página.

Elección de página con switch

html 
<!DOCTYPE html>
<html>
<head>
<title>Switch — page choice</title>
</head>
<body>
<p id="out">…</p>
<script>
let day = 3;
let msg;
switch (day) {
case 1:
msg = "Mon";
break;
case 2:
msg = "Tue";
break;
case 3:
msg = "Wed";
break;
default:
msg = "other";
}
let box = document.getElementById("out");
box.textContent = "day=" + msg;
</script>
</body>
</html>

day es 3, la página muestra day=Wed. Pon day en 9, recarga y deberías ver day=other. La siguiente lección (for) repite trabajo muchas veces; para «¿qué etiqueta fija?» la herramienta sigue siendo switch.

Pruébalo tú

  1. Construye un switch con let day = 1 que registre "Mon" en el case 1.
  2. Añade cases para 2 y 3 con break después de cada uno.
  3. Pon day en 9 y confirma que default registra "other".
  4. Cambia sobre una cadena status con "ok", "warn", "err".
  5. Quita un break un momento y observa el fall-through en la Consola.
  6. En la demo HTML cambia solo day, recarga y lee el nuevo texto day=.

Errores habituales

  • Olvidar break tras un case (también corren los siguientes)
  • Usar switch para rangos abiertos (score >= 60) — mejor if / else if
  • Mezclar tipos de modo que un número nunca coincida con un case de cadena
  • Omitir default cuando los valores desconocidos aún necesitan mensaje
  • Sustituir todo if por switch cuando el chequeo no es una lista de etiquetas fijas

Resumen

  • switch empareja un valor con varias etiquetas case
  • break detiene el switch tras una coincidencia
  • default corre cuando nada coincidió
  • Ideal para valores discretos; los rangos se quedan con if / else if
  • Guarda una etiqueta si necesitas el resultado después; muéstrala en la página cuando ayude
  • Siguiente: bucle for — repetir trabajo un número fijo de veces

🧠 Pon a Prueba tu Conocimiento

Listo para Empezar

Pon a Prueba tu Conocimiento

Ponte a prueba con este cuestionario interactivo y descubre qué tan bien entiendes el tema

❓
8
Preguntas
🎯
70%
Para Aprobar
♾️
∞
Tiempo
🔄
∞
Intentos

📝 Instrucciones

  • Lee cada pregunta cuidadosamente
  • Selecciona la mejor respuesta para cada pregunta
  • Puedes repetir el quiz tantas veces como quieras
  • Tu progreso se mostrará en la parte superior
Tema 22 de 23
Javascript Tutorial