El primer tipo de bucle se denomina bucle while. Este bucle se caracteriza en que se repite, revisando la condición en cada iteración y sólo se detiene cuando la condición es falsa.

Bucle while

El bucle while es uno de los bucles más simples que podemos crear. Vamos a repasar el siguiente ejemplo y analizar todas sus partes, para luego analizar lo que ocurre en cada iteración del bucle. Empecemos por un fragmento sencillo del bucle:

let i = 0;  // Inicialización de la variable contador

// Condición: Mientras la variable contador sea menor de 5
while (i < 5) {
  console.log("Valor de i:", i);

  i = i + 1; // Incrementamos el valor de i
}

Veamos que es lo que ocurre a la hora de ejecutar este código:

1. Antes de entrar en el bucle while, se inicializa la variable i al valor 0.
2. Antes de realizar la primera iteración del bucle, comprobamos la condición.
3. Si la condición es verdadera, hacemos las tareas que están indentadas dentro del bucle.
4. Mostramos por pantalla el valor de i.
5. Luego, incrementamos el valor de i sumándole 1 a lo que ya teníamos en i.
6. Terminamos la iteración del bucle, por lo que volvemos al inicio del while a hacer una nueva iteración.
7. Volvemos al punto 2) donde comprobamos de nuevo la condición del bucle.
8. Repetimos hasta que la condición sea falsa. Entonces, salimos del bucle y continuamos el programa.

Traza del bucle

Una tarea que suele servir para entender mejor el bucle, es hacer una traza de lo que haría un programa internamente. Esto es ir realizando cada paso, para entenderlo bien.

Veamos una muestra paso a paso de las iteraciones de este ejemplo anterior:

El bucle while es muy simple, pero requiere no olvidarse accidentalmente de la inicialización y el incremento (además de la condición). Más adelante veremos otro tipo de bucle denominado bucle for, que tiene una sintaxis diferente y, habitualmente, se suele utilizar más en el día a día.

La operación i = i + 1 es lo que se suele llamar un incremento de una variable. Es muy común simplificarla como i++, que hace exactamente lo mismo: aumenta en 1 su valor.

Bucle do ... while

Existe una variación del bucle while denominado bucle do while. La diferencia fundamental, a parte de variar un poco la sintaxis, es que este tipo de bucle siempre se ejecuta una vez, al contrario que el bucle while que en algún caso podría no ejecutarse nunca.

Para entenderlo bien, antes de ver el bucle do while vamos a analizar el siguiente ejemplo:

let i = 5;

while (i < 5) {
  console.log("Hola a todos");
  i = i + 1;
}

console.log("Bucle finalizado");

Observa, que aún teniendo un bucle, este ejemplo nunca mostrará el texto Hola a todos, puesto que la condición nunca será verdadera, porque ya ha empezado como falsa (i ya vale 5 desde el inicio). Por lo tanto, nunca se llega a realizar el interior del bucle.

Con el bucle do while podemos obligar a que siempre se realice el interior del bucle al menos una vez:

let i = 5;

do {
  console.log("Hola a todos");
  i = i + 1;
} while (i < 5);

console.log("Bucle finalizado");

Observa los siguientes detalles de la variación do while:

1. En lugar de utilizar un while desde el principio junto a la condición, escribimos do.
2. El while con la condición se traslada al final del bucle.
3. Lo que ocurre en este caso es que el interior del bucle se realiza siempre, y sólo se analiza la condición al terminar el bucle, por lo que aunque no se cumpla, se va a realizar al menos una vez.

Este ejemplo suele ser interesante cuando queremos establecer un bucle pero queremos que siempre se realice una vez, independientemente de si cumple o no la condición.