JavaScript while: Realizar bucles condicionales con JS

En el siguiente post vamos a repasar la función de JavaScript while, su finalidad es la de realizar bucles condicionales hasta que se cumpla cierta condición para que pare o se detenga dicho loop.

Anteriormente escribí estos post sobre bucles condicionales en otros lenguajes de programación:

• En PHP tenemos las funciones for, foreach y while.
• jQuery each(): Mismo funcionamiento que foreach pero en jQuery.
• Y en JavaScript tenemos el bucle for JS

Sintaxis de la función de JavaScript while

Veamos la sintaxis de esta extraída de su web oficial:

while (condicionante) {
    script a ejecutar
}

La sintaxis es sencilla, mientras se cumpla la condición se ejecutará el bucle while. A continuación os muestra otra sintaxis de la función:

do {
    script a ejecutar
}
while (condicionante);

En esta nueva sintaxis el el condicionante siempre se comprueba una vez realizado el bucle.

Ejemplos de JavaScript while

Vayamos con 2 ejemplos de while:

var frase = "";
var n = 1;
while (n < 10) 
 { 
 frase += "El valor de n es " + n + "<br>"; 
 n++;
 }
document.writeln(frase);

Os explico el primer ejemplo:

• Declaramos las variables ‘frase’ (contendra el mensaje) y ‘n’ (recuento del bucle condicionante).
• Realizamos el bucle while mientras que el valor de ‘n’ se inferior a 10.
• Añadimos a la variable ‘frase’ un texto y el valor de ‘n’.
• Sumamos un valor a la variable ‘n’.
• Mostramos por pantalla el valor de la variable ‘frase’.

var frase = "";
var n = 1;
 do{ 
 frase += "El valor de n es " + n + "<br>"; 
 n++;
 }while (n < 10) 
document.writeln(frase);

Os explico el segundo ejemplo:

• Declaramos las variables ‘frase’ (contendra el mensaje) y ‘n’ (recuento del bucle condicionante).
• Realizamos el bucle.
• Añadimos a la variable ‘frase’ un texto y el valor de ‘n’.
• Sumamos un valor a la variable ‘n’.
• Realizamos el bucle while mientras que el valor de ‘n’ se inferior a 10.
• Mostramos por pantalla el valor de la variable ‘frase’.