El bucle 'for' de JS

La instrucción for es una estructura de control que permite crear bucles de forma controlada, por lo que es una herramienta muy utilizada en JavaScript. Su uso facilita la repetición de código tantas veces como sea necesario, hasta que la condición especificada se evalúe como falsa.

A diferencia del bucle ‘while’, que suele utilizarse cuando no se conoce el número de repeticiones necesarias, el bucle for es la opción habitual cuando el número de iteraciones es fijo y conocido o fácilmente controlable. Por ejemplo, puede usarse para recorrer un rango definido de números, recorrer los índices de un array, crear estructuras repetitivas o acumular cálculos que requieren varios pasos.

Existen otras variantes más específicas de bucles controlados: for…of se utiliza para crear bucles sobre arrays, mientras que for…in permite trabajar con bucles relacionados con las propiedades de objetos.

Estructura

La estructura de los bucles for integra tres expresiones en su encabezado (inicialización, condición y actualización), lo que lo hacen compacto y flexible, aunque puede resultar algo complejo para quien empieza a programar. Tras el encabezado se encuentra el cuerpo, que contiene el código a repetir.

Veamos detalladamente el propósito de estas expresiones:

Inicialización: es la expresión que se ejecuta una sola vez, antes de que comience el bucle. Se utiliza para declarar o asignar una variable de control, como sería un contador. Con esta variable indicamos el valor inicial del bucle.

Condición: es una expresión booleana que se evalúa al inicio de cada iteración. Comprueba si la condición es verdadera. Si es verdadera, se ejecuta el código indicado en el bucle. En caso contrario, el bucle termina. La condición indicada será evaluada al inicio de cada nueva iteración.

Si se omite la condición, se considera siempre verdadera. Esto podría producir un bucle infinito si no se controla de otra manera.

Actualización: es la expresión que se ejecuta al finalizar cada iteración, justo después de ejecutar el código del cuerpo del bucle. Se utiliza para modificar (incrementar o disminuir) el valor de la variable de control.

Cualquiera de estas tres expresiones del encabezado del for son opcionales, por lo que pueden omitirse. Lo único que no puede omitirse son los punto y coma (;) que permiten delimitar su posición. Así podemos construir bucles muy flexibles, como los bucles infinitos controlados de forma manual.

for (;;) {
  // Bucle infinito
}

Algoritmo

El algoritmo del bucle for sigue un orden de ejecución muy concreto. En primer lugar se ejecuta la expresión de «inicialización», que se evalúa una sola vez antes de que comience el bucle y permite declarar la variable de control.

A continuación se evalúa la «condición»: si el resultado es verdadero, se inicia la primera iteración; pero si es falso, el bucle finaliza de forma inmediata sin ejecutar el código del cuerpo. La condición se verifica en cada iteración.

Diagrama de flujo de un bucle 'for'
Diagrama de flujo de un bucle 'for'.

Cuando se ejecuta el cuerpo del bucle, JS evalúa la expresión de «actualización», cuya función habitual es modificar la variable de control (incrementándola o disminuyéndola), para avanzar hacia la finalización del bucle.

Tras la actualización, el flujo de control del programa regresa al punto de evaluación de la «condición». Este ciclo se repite tantas veces como sea necesario, hasta que la condición inicial resulte falsa. Entonces, el bucle habrá terminado.

Sintaxis

La sintaxis del bucle for es compacta y bien definida. Comienza con la palabra reservada for y, entre paréntesis (), se indican las tres expresiones que controlan el bucle, separadas con un punto y coma (;).

for (inicialización; condición; actualización) {
  // Código que se ejecuta
  // si la condición es true
}

Tras el encabezado se coloca el cuerpo del bucle, delimitado por llaves {}. El cuerpo contiene las sentencias que se ejecutarán en cada iteración. Si el cuerpo consta de una sola instrucción, las llaves pueden omitirse, aunque si se incluyen se mejora significativamente la legibilidad del código.

Ejemplo: contador numérico

Un ejemplo sencillo para comprender cómo funciona el bucle for es crear un contador. Para ello, se inicializa la variable de control con un valor inicial: en este caso, 1; se define una condición que debe cumplirse: i < 5 (i es menor que 5); y se indica una actualización que incrementa el contador en cada iteración: el operador aritmético i++, equivalente a i = i + 1.

for (let i = 1; i < 5; i++) {
  console.log('Iteración:', i);
}

Como la expresión de inicialización establece i en 1, el primer mensaje mostrado corresponde a ese valor. El bucle sigue ejecutándose mientras la condición sea verdadera, por lo que se realizan cuatro iteraciones.

Este es el resultado:

Iteración: 1
Iteración: 2
Iteración: 3
Iteración: 4

Saltar una iteración

La instrucción continue permite saltar una iteración del bucle para ir de forma directa hacia la iteración siguiente. Esta funcionalidad puede ser muy útil cuando se necesita crear excepciones dentro de un bucle.

Por ejemplo, vamos a esquivar la tercera iteración:

for (let i = 1; i < 5; i++) {
  if (i === 3) {
    continue;
  }
  console.log('Iteración:', i);
}

Cuando la variable i vale 3, se ejecuta la instrucción continue, con lo cual, el flujo del programa salta hasta la siguiente iteración.

Resultado:

Iteración: 1
Iteración: 2
Iteración: 4

Interrumpir el bucle

La instrucción break permite interrumpir el bucle en la iteración actual, siempre que se cumpla una condición determinada. Su utilidad radica en la necesidad de terminar el bucle de forma excepcional.

Vamos a terminar el bucle en la tercera iteración:

for (let i = 1; i < 5; i++) {
  if (i === 3) {
    break;
  }
  console.log('Iteración:', i);
}

Cuando la variable i vale 3, se ejecuta la instrucción break. En este momento, el bucle termina antes de imprimir la tercera iteración.

Resultado:

Iteración: 1
Iteración: 2

← Artículo anterior