Contenido del curso

Fundamentos Javascript

Funciones, Scope y Estructuras de Datos

for, for of y for in en JavaScript

Resumen

Los bucles en JavaScript te permiten ejecutar bloques de código tantas veces como necesites, y dominarlos es clave para construir aplicaciones que iteren listas, validen condiciones o procesen objetos complejos. Aquí verás cómo usar for, for of y for in con ejemplos reales aplicados a un proyecto de notas.

¿Qué son las sentencias de repetición y cuándo usar for o while?

En JavaScript existen dos palabras reservadas principales para bucles: for y while, junto con variaciones como do-while. La diferencia es de intención.

  • for: lo usas cuando ya sabes cuántas veces vas a repetir algo. Piensa en haz 10 flexiones.
  • while: lo usas mientras una condición se mantenga verdadera. Algo como sigue leyendo hasta que tengas luz.
  • do-while: ejecuta primero la acción y luego valida. Como prueba la comida y, si está picante, agrégale más agua.

Cada variación responde a una lógica distinta de control de flujo, y elegir la correcta hace tu código más legible [00:34].

¿Cómo funciona la anatomía de un for en JavaScript?

La estructura de un for tiene tres partes dentro del paréntesis: inicialización, condición e incremento. En el editor, dentro de un archivo 10-forWhile.js, puedes escribir:

js for (let i = 0; i < 5; i++) { console.log(i); }

Aquí pasa lo siguiente: let i = 0 inicializa la variable, i < 5 es la condición que mantiene viva la iteración, e i++ incrementa el valor en cada vuelta. El resultado en consola va de 0 a 4, porque la condición usa menor que y no menor o igual que [03:10].

¿Por qué se usa la letra i en los bucles for? Por convención, i representa el índice de la iteración. Es una variable temporal que cambia de valor en cada vuelta del bucle.

¿Cómo iterar un array de notas con for clásico?

Imagina que tu aplicación maneja un listado de notas y necesitas mostrarlas todas. Empieza declarando una constante con un array de strings:

js const notas = ["nota uno", "nota dos", "nota tres"];

for (let i = 0; i < notas.length; i++) { console.log(El índice ${i} viene de notas: ${notas[i]}); }

Aquí entran en juego varios conceptos que ya viste antes: template literals para componer mensajes legibles, la propiedad length que aplica sobre arrays y strings para conocer su tamaño, y el acceso por índice con notas[i].

El bucle entra en la posición 0, accede a nota uno, incrementa, accede a nota dos, y así hasta agotar el array. Es la forma más explícita de iterar y te da control total sobre el índice [07:45].

¿Qué diferencia hay entre for of y for clásico?

El for of itera directamente sobre los valores de un iterable, sin que tengas que manejar índice ni incremento manual. Es más legible cuando solo te interesa el contenido.

js const frutas = ["manzana", "pera", "uva"];

for (const fruta of frutas) { if (fruta === "manzana") { console.log("Es una rica manzana"); } console.log(fruta); }

Fíjate en dos detalles importantes. Primero, aquí usas const en vez de let, porque la variable fruta no cambia dentro de cada iteración: simplemente recibe el siguiente valor del array. Segundo, puedes anidar un if dentro del for para validar condiciones específicas.

¿Cuándo usar for of en lugar de for tradicional? Cuando solo necesitas los valores y no el índice. El código queda más limpio y evita errores con el incremento manual.

Este ejemplo muestra cómo se mezclan conocimientos previos: variables, condicionales y bucles trabajando juntos en un mismo bloque lógico [11:20].

¿Cómo recorrer las propiedades de un objeto con for in?

El for in está pensado para iterar sobre claves o índices de estructuras más complejas, como los objetos. Mientras for of trabaja con valores, for in te entrega las llaves.

js const persona = { nombre: "Ana", edad: 25 };

for (const clave in persona) { console.log(La clave ${clave} dentro de persona vale ${persona[clave]}); }

En cada vuelta, clave toma el valor nombre y luego edad. Para acceder al valor asociado, usas la notación persona[clave], que es una forma dinámica de leer propiedades de un objeto.

Esto te abre la puerta a manejar estructuras tipo llave-valor, fundamentales cuando trabajas con datos provenientes de APIs, formularios o bases de datos [14:55].

¿Por qué importa elegir el bucle correcto?

Cuando diseñas la lógica de tu aplicación, decidir entre for, for of o for in afecta tanto el rendimiento como la claridad del código.

  • Usa for clásico cuando necesites el índice o un control numérico preciso.
  • Usa for of para recorrer valores de arrays, strings o cualquier iterable.
  • Usa for in para inspeccionar las claves de un objeto.

Mezclar bucles con condicionales (if, else, switch), variables y operadores te da el músculo necesario para construir flujos reales en tu aplicación.

¿Ya probaste los retos de la sección de recursos? Comparte tu solución en los comentarios para revisarla y aprender en comunidad.