Las sentencias switch en JavaScript proporcionan una forma más clara y organizada de manejar múltiples condiciones en comparación con las sentencias if-else anidadas. Son especialmente útiles cuando se necesita comparar una variable o expresión con varios valores posibles y ejecutar diferentes bloques de código en función del resultado.
Conceptos Clave
-
Sintaxis Básica:
switch (expresión) { case valor1: // Código a ejecutar si expresión === valor1 break; case valor2: // Código a ejecutar si expresión === valor2 break; // Puedes tener tantos casos como necesites default: // Código a ejecutar si ninguno de los casos anteriores coincide } -
Expresión: La expresión que se evalúa una vez y se compara con los valores de cada caso.
-
Casos: Cada
caserepresenta un valor posible de la expresión. Si la expresión coincide con el valor del caso, se ejecuta el bloque de código correspondiente. -
Break: La sentencia
breakse utiliza para salir del bloqueswitchuna vez que se ha ejecutado el código de un caso. Sinbreak, el código continuará ejecutándose en los siguientes casos (comportamiento conocido como "fall-through"). -
Default: El bloque
defaultes opcional y se ejecuta si ninguno de los casos coincide con la expresión. Es similar a la cláusulaelseen una sentenciaif-else.
Ejemplo Práctico
Vamos a ver un ejemplo práctico para entender mejor cómo funcionan las sentencias switch.
Ejemplo: Determinar el Día de la Semana
let dia = 3;
let nombreDelDia;
switch (dia) {
case 1:
nombreDelDia = 'Lunes';
break;
case 2:
nombreDelDia = 'Martes';
break;
case 3:
nombreDelDia = 'Miércoles';
break;
case 4:
nombreDelDia = 'Jueves';
break;
case 5:
nombreDelDia = 'Viernes';
break;
case 6:
nombreDelDia = 'Sábado';
break;
case 7:
nombreDelDia = 'Domingo';
break;
default:
nombreDelDia = 'Día inválido';
}
console.log(nombreDelDia); // Output: MiércolesExplicación del Código
-
Declaración de Variables:
let dia = 3; let nombreDelDia;Aquí,
diaes la variable que vamos a evaluar en la sentenciaswitch.nombreDelDiaalmacenará el nombre del día correspondiente. -
Sentencia Switch:
switch (dia) { case 1: nombreDelDia = 'Lunes'; break; case 2: nombreDelDia = 'Martes'; break; case 3: nombreDelDia = 'Miércoles'; break; case 4: nombreDelDia = 'Jueves'; break; case 5: nombreDelDia = 'Viernes'; break; case 6: nombreDelDia = 'Sábado'; break; case 7: nombreDelDia = 'Domingo'; break; default: nombreDelDia = 'Día inválido'; }La expresión
diase compara con cada caso. Cuandodiaes igual a3, se ejecuta el bloque de código correspondiente y se asigna'Miércoles'anombreDelDia. La sentenciabreakasegura que el programa salga del bloqueswitchdespués de encontrar una coincidencia. -
Salida del Resultado:
console.log(nombreDelDia); // Output: Miércoles
Ejercicio Práctico
Ejercicio 1: Clasificación de Calificaciones
Escribe una función que reciba una calificación numérica (0-100) y devuelva una letra según la siguiente escala:
- 90-100: A
- 80-89: B
- 70-79: C
- 60-69: D
- 0-59: F
function obtenerCalificacion(letra) {
let calificacion;
switch (true) {
case (letra >= 90 && letra <= 100):
calificacion = 'A';
break;
case (letra >= 80 && letra < 90):
calificacion = 'B';
break;
case (letra >= 70 && letra < 80):
calificacion = 'C';
break;
case (letra >= 60 && letra < 70):
calificacion = 'D';
break;
case (letra >= 0 && letra < 60):
calificacion = 'F';
break;
default:
calificacion = 'Calificación inválida';
}
return calificacion;
}
// Prueba la función
console.log(obtenerCalificacion(85)); // Output: B
console.log(obtenerCalificacion(92)); // Output: A
console.log(obtenerCalificacion(58)); // Output: F
console.log(obtenerCalificacion(105)); // Output: Calificación inválidaSolución Explicada
-
Función
obtenerCalificacion:function obtenerCalificacion(letra) { let calificacion; -
Sentencia Switch:
switch (true) { case (letra >= 90 && letra <= 100): calificacion = 'A'; break; case (letra >= 80 && letra < 90): calificacion = 'B'; break; case (letra >= 70 && letra < 80): calificacion = 'C'; break; case (letra >= 60 && letra < 70): calificacion = 'D'; break; case (letra >= 0 && letra < 60): calificacion = 'F'; break; default: calificacion = 'Calificación inválida'; } -
Retorno del Resultado:
return calificacion; -
Pruebas:
console.log(obtenerCalificacion(85)); // Output: B console.log(obtenerCalificacion(92)); // Output: A console.log(obtenerCalificacion(58)); // Output: F console.log(obtenerCalificacion(105)); // Output: Calificación inválida
Conclusión
Las sentencias switch son una herramienta poderosa para manejar múltiples condiciones de manera clara y organizada. Son especialmente útiles cuando se necesita comparar una variable con varios valores posibles. Recuerda siempre usar la sentencia break para evitar el comportamiento de "fall-through" y utilizar el bloque default para manejar casos no previstos. Con la práctica, dominarás el uso de switch y podrás aplicarlo eficazmente en tus programas JavaScript.
JavaScript: De Principiante a Avanzado
Módulo 1: Introducción a JavaScript
- ¿Qué es JavaScript?
- Configuración de tu Entorno de Desarrollo
- Tu Primer Programa en JavaScript
- Sintaxis y Conceptos Básicos de JavaScript
- Variables y Tipos de Datos
- Operadores Básicos
Módulo 2: Estructuras de Control
- Sentencias Condicionales
- Bucles: for, while, do-while
- Sentencias Switch
- Manejo de Errores con try-catch
Módulo 3: Funciones
- Definición y Llamada de Funciones
- Expresiones de Función y Funciones Flecha
- Parámetros y Valores de Retorno
- Ámbito y Closures
- Funciones de Orden Superior
Módulo 4: Objetos y Arrays
- Introducción a los Objetos
- Métodos de Objeto y la Palabra Clave 'this'
- Arrays: Conceptos Básicos y Métodos
- Iteración sobre Arrays
- Desestructuración de Arrays
Módulo 5: Objetos y Funciones Avanzadas
- Prototipos y Herencia
- Clases y Programación Orientada a Objetos
- Módulos e Importación/Exportación
- JavaScript Asíncrono: Callbacks
- Promesas y Async/Await
Módulo 6: El Modelo de Objetos del Documento (DOM)
- Introducción al DOM
- Selección y Manipulación de Elementos del DOM
- Manejo de Eventos
- Creación y Eliminación de Elementos del DOM
- Manejo y Validación de Formularios
Módulo 7: APIs del Navegador y Temas Avanzados
- Almacenamiento Local y de Sesión
- Fetch API y AJAX
- WebSockets
- Service Workers y Aplicaciones Web Progresivas (PWAs)
- Introducción a WebAssembly
Módulo 8: Pruebas y Depuración
- Depuración de JavaScript
- Pruebas Unitarias con Jest
- Pruebas de Integración
- Pruebas de Extremo a Extremo con Cypress
Módulo 9: Rendimiento y Optimización
- Optimización del Rendimiento de JavaScript
- Gestión de Memoria
- Manipulación Eficiente del DOM
- Carga Perezosa y División de Código
Módulo 10: Frameworks y Librerías de JavaScript
- Introducción a React
- Gestión de Estado con Redux
- Conceptos Básicos de Vue.js
- Conceptos Básicos de Angular
- Elegir el Framework Adecuado
