
- 1. Introducción a JS
- 2. Variables y Constantes
- 3. Tipos de datos
- 4. Operadores Aritméticos
- 5. Operadores de Asignación
- 6. Operadores de Comparación
- 7. Operadores Lógicos
- 8. Operador Ternario
- 9. Operadores Avanzados
- 10. Estructuras de Control
- 11. Condicionales
- ✚ Ejercicio 1: Operaciones
- ▭ Ejercicio 2: Calcular Área Rectángulo
- ✉ Ejercicio 3: Generador de mensaje
- ⌨ Ejercicio 4: Detector de teclas presionadas
Una estructura de control de flujo en JavaScript es una herramienta que permite controlar el orden en el que se ejecutan las instrucciones en un programa, dependiendo de condiciones o repeticiones. Básicamente, estas estructuras permiten que el código tome decisiones, repita acciones o ejecute ciertos bloques de código bajo condiciones específicas.
script.js
// Operador de propagación
let usuario = {
nombre: "Carlos",
edad: 30,
direccion: { ciudad: "Madrid", pais: "España" },
};
// Operador de encadenamiento opcional
console.log(usuario.direccion?.ciudad); // Muestra: "Madrid"
console.log(usuario.direccion?.codigoPostal); // Muestra: undefined
// Operador de coalescencia nula
let telefono = usuario.telefono ?? "No disponible";
console.log(telefono); // Muestra: "No disponible"
// Modificar el objeto utilizando propagación
let usuarioActualizado = {
...usuario,
edad: 31, // Cambia la edad
};
console.log(usuarioActualizado);
// Muestra: { nombre: "Carlos", edad: 31, direccion: { ciudad: "Madrid", pais: "España" } }
Condicionales:
Permiten ejecutar bloques de código dependiendo de si una condición es verdadera o falsa.
🔸if: Ejecuta un bloque de código si una condición es verdadera.
if (edad >= 18) {
console.log("Eres mayor de edad.");
}
🔸else: Ejecuta un bloque de código si la condición del if
es falsa.
if (edad >= 18) {
console.log("Eres mayor de edad.");
} else {
console.log("Eres menor de edad.");
}
🔸else if: Permite comprobar múltiples condiciones.
if (edad < 18) {
console.log("Eres menor de edad.");
} else if (edad >= 18 && edad <= 65) {
console.log("Eres adulto.");
} else {
console.log("Eres adulto mayor.");
}
🔸switch: Compara una expresión con múltiples posibles casos.
let dia = 3;
switch (dia) {
case 1:
console.log("Lunes");
break;
case 2:
console.log("Martes");
break;
case 3:
console.log("Miércoles");
break;
default:
console.log("Día no válido");
}
Bucles (Loops)
Permiten ejecutar un bloque de código varias veces bajo ciertas condiciones.
🔸for: Ejecuta un bloque de código un número específico de veces.
for (let i = 0; i < 5; i++) {
console.log(i);
}
🔸while: Ejecuta un bloque de código mientras se cumpla una condición.
let i = 0;
while (i < 5) {
console.log(i);
i++;
}
🔸do…while: Ejecuta un bloque de código al menos una vez y luego repite mientras la condición sea verdadera.
let i = 0;
do {
console.log(i);
i++;
} while (i < 5);
Control de flujo de ejecución:
Estas estructuras permiten alterar el flujo de ejecución, como salir de un bucle o interrumpir una función.
🔸break: Termina un bucle o una estructura switch
.
for (let i = 0; i < 10; i++) {
if (i === 5) {
break; // Salir del bucle cuando i sea 5
}
console.log(i);
}
🔸continue: Salta la iteración actual del bucle y continúa con la siguiente.
for (let i = 0; i < 5; i++) {
if (i === 2) {
continue; // Salta el 2 y sigue con la siguiente iteración
}
console.log(i);
}
Estas estructuras son fundamentales para controlar cómo se ejecuta el código y pueden combinarse para crear programas complejos. A continuación iremos viéndolas una por una.