for loop de JavaScript: recorre arrays por índice

El for loop de JavaScript repite un bloque de código una cantidad controlada de veces usando tres expresiones: inicialización, condición y actualización. Úsalo cuando necesites el índice del bucle: para acceder a posiciones de un array, comparar elementos vecinos o contar iteraciones. A diferencia de forEach o for...of, la sentencia for clásica de JavaScript da control directo sobre los valores de inicio, fin y paso.

Ejemplo de for loop en JavaScript para iterar arrays

Salida:

Paso 0: compilar
Paso 1: probar
Paso 2: desplegar

Cómo funciona este ejemplo

1. let i = 0 crea un contador con alcance de bloque que empieza en el primer índice del array.
2. i < tareas.length evalúa la condición antes de cada iteración: el bucle se detiene cuando i llega a tareas.length, evitando una lectura fuera de rango.
3. i++ incrementa el contador después de que termina el cuerpo de cada iteración.
4. tareas[i] lee el elemento en la posición i, emparejando cada valor con su índice.

El límite < length (no <=) es el patrón estándar porque los índices de un array van de 0 a length - 1.

Errores comunes en los for loops de JavaScript

Error de límite con <=

Incorrecto:

const items = ["a", "b", "c"];
for (let i = 0; i <= items.length; i++) {
  console.log(items[i]);
}

Correcto:

const items = ["a", "b", "c"];
for (let i = 0; i < items.length; i++) {
  console.log(items[i]);
}

<= ejecuta una iteración extra, así que items[items.length] es undefined.

Usar var en callbacks asíncronos

Incorrecto:

for (var i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 0);
}
// imprime: 3, 3, 3

Correcto:

for (let i = 0; i < 3; i++) {
  setTimeout(() => console.log(i), 0);
}
// imprime: 0, 1, 2

var tiene alcance de función, así que los callbacks leen el i final. let crea un nuevo binding en cada iteración.

for loop vs for…of

Usa for...of por defecto; cambia a un for clásico cuando necesites el índice o saltos no secuenciales.

Más ejemplos

Salir antes con break:

const temperaturas = [22, 18, 35, 29];
for (let i = 0; i < temperaturas.length; i++) {
  if (temperaturas[i] > 30) {
    console.log("Primer día caluroso en el índice", i);
    break;
  }
}

break detiene el bucle de inmediato. Sin break, el bucle seguiría revisando cada elemento restante después de encontrar la primera coincidencia.

Saltar iteraciones con continue:

for (let i = 0; i < 5; i++) {
  if (i === 2) continue;
  console.log(i);
}
// 0, 1, 3, 4

continue omite el resto del cuerpo de la iteración actual, pero aun así ejecuta la expresión de actualización (i++) antes de la siguiente evaluación de la condición.

Preguntas frecuentes

¿Cuál es la sintaxis de un for loop en JavaScript?

Una sentencia for de JavaScript tiene tres expresiones opcionales: for (init; condition; update). La inicialización se ejecuta una vez antes de que empiece el bucle, la condición se evalúa antes de cada iteración y la actualización se ejecuta después de cada cuerpo de iteración. Las tres son opcionales: omitir la condición crea un bucle infinito que debes salir con break.

Bucle while vs for en JavaScript: ¿cuándo usar cada uno?

Usa un bucle for cuando la inicialización, la condición y la actualización dependen del mismo contador: agruparlas en una sola línea hace visibles de inmediato los límites del bucle. Usa while cuando la condición de salida depende de estado externo o cuando la lógica de preparación y actualización pertenece al cuerpo del bucle en lugar del encabezado.

¿Cómo detienes antes un for loop de JavaScript?

Coloca una sentencia break dentro del cuerpo del bucle. Cuando el motor encuentra break, sale del bucle de inmediato y continúa la ejecución después de la llave de cierre. Combina break con una condición para detenerte en cuanto encuentres un valor objetivo y evitar iteraciones innecesarias.