El loop Javascript while

Los bucles pueden ejecutar un bloque de código siempre que se cumpla una condición específica.

El bucle while

El bucle while recorre un bloque de código siempre que una condición especificada sea verdadera.

Sintaxis

while (condición) {
  // bloque de código que se ejecuta
}

Ejm

En el siguiente ejemplo, el código del bucle se ejecutará una y otra vez siempre que una variable (i) sea menor que 10.

<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
</head>
<h2>Bucle while</h2>
<p id="demo"></p>

<script>
var text = "";
var i = 0;

while(i <10)
{
text += "<br /> El número es " + i;
i++;
}
document.getElementById("demo").innerHTML = text;
</script>
</html>

Si olvida aumentar la variable utilizada en la condición, el ciclo nunca terminará. Esto bloqueará su navegador.

El bucle do/while

El bucle do / while es una variante del bucle while. Este bucle ejecutará el bloque de código una vez, antes de verificar si la condición es verdadera, luego repetirá el bucle siempre que la condición sea verdadera.

Sintaxis

do {
  // bloque de código que se ejecuta
}
while (condición);

Ejm

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Do/While Loop</h2>

<p id="demo"></p>

<script>
var text = ""
var i = 0;

do {
text += "<br>The number is " + i;
i++;
}
while (i < 10);

document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

¡No olvide aumentar la variable utilizada en la condición, de lo contrario, el ciclo nunca terminará!

Comparando for y while

Si has leído el capítulo anterior, sobre el bucle for, descubrirás que un bucle while es muy similar a un bucle for, con la declaración 1 y la declaración 3 omitidas.

El bucle de este ejemplo utiliza un bucle for para recopilar los nombres de los coches de la matriz de coches.

Ejm1

var cars = ["BMW""Volvo""Saab""Ford"];
var i = 0;
var text = "";

for (;cars[i];) {
  text += cars[i] + "<br>";
  i++;
}

Ejm2

var i = 0;
var text = "";

while (cars[i]) {
  text += cars[i] + "<br>";
  i++;
}