Entendido.

Este sitio utiliza cookies para analizar la navegación. Si continúa navegando se entiende que acepta su uso. Ver más detalles.";

Logo

Aprende Web

Crea y diseña tus sitios en la Web.

Manual de Javascript

Javascript: lenguaje interactivo para dinamizar la web.


Y ahora tambien aprende a programar en C++ con Aprende Web C++

logo rss RSS. Suscribir canal.

Buscar en Aprende Web

Traducir página

Visita nuestro blog:

bolg.aprende-web.net

y entérate de las novedades o deja un comentario.

Dudas y sugerencias:

aprendeweb@aprende-web.net





Sobre ésta página

Ültima modificación: 29-01-2016.

Visitas este mes: 52

Visitas el mes pasado: 83

logo
WEB-GRAFÍA

Mi agradecimiento a los siguientes sitios en los que me he basado para la elaboración de este manual.:

Desarrollo Web: manual de Javascript
Desarrollo Web, por Miguel Angel Álvarez
Libros Web: introducción a Javascript
Libros web, por Javier Eguíluz Pérez
Curso de Javascript: Programación Web
www.programacionweb.net
WebEstilo: JavaScript
www.webestilo.com
W3 schools; Javascript Tutorial
www.w3schools.com
Manual de Javascript: José Antonio Rodríguez.
Jose Antonio Rodriguez: manual en PDF

Donativos

Si este sitio te parece interesante puedes contribuir con una pequeña aportación.




8. Otras estructuras (I)

8.1 Estructura while

javascript

La estructura while permite formar un bucle que se repite mientras se cumpla una condición.

Esta estructura puede adoptar dos maneras diferentes, while y do...while. Su comportamiento es diferente según la forma que elijamos. Veamoslo a continuación.


La estructura while: forma simple

La estructura while propiamente dicha, permite formar un bucle en el que una serie de sentencias se repiten mientras se cumpla una condición.

la estructura while tiene la siguiente forma:

while(condicion) {
... sentencias javascript ...
}

La estructura es similar a la del bucle for, pero aquí en el paréntesis no se indican ni el valor inicial, ni la actualización de este valor, con lo cual para que el bucle no se repita indefinidamente, dentro del bucle tenemos que modificar las variables que controlan la condición.

A continuación se muestra una página de ejemplo donde se usa el bucle while:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Bucle while</title> 
<script type="text/javascript">
function repite() {
         num = document.repetir.numero.value; //acceso a número escrito por el usuario
         num = Number(num); //convertir texto en número
         texto = document.getElementById("respuesta"); //elemento donde escribiremos
         i = 0;
         if (num<1 || num>20 || isNaN(num) == true ) { //si el número no es válido
            texto.innerHTML = "No has escrito un número entre 0 y 20, escribelo de nuevo y pulsa el botón.";
            }
         else { //si el numero es válido
            texto.innerHTML = "Voy a repetir una frase " + num + " veces.<br/>";
            while (i<num) { //repeticion hasta llegar al número de veces indicado.
                i++; //variar la condición.
                texto.innerHTML += i + " Esta es una frase repetida " + num + " veces. <br/>";
                }			
            }
         }
</script>
</head>
<body>
<h1>Utilizar el bucle while</h1>
<form action="#" name="repetir">
   <input type="text" name="numero"> Escibe un número del 1 al 20<br/><br/>
   <input type="button" onclick="repite()" value="Pulsa para repetir" />
</form>
   <p id="respuesta"></p>
</body>
</html>

El método o función interna isNaN() sirve para comprobar si una variable es un número o no. caso de que no lo sea devuelve true, y si lo es devuelve false. NaN significa Not a Number (en español no es un número). Más adelante veremos éste y otros métodos de javascript.

Puedes ver como queda esta página de ejemplo pulsando en el siguiente enlace:

Ejemplo bucle while



Estructura do while

Esta estructura es muy parecida a la anterior, forma un bucle que repite la condición indicada mientras esta se cumple. Sin embargo aquí la condición aunque no se cumpla, el bucle se ejecuta siempre la primera vez.

La estructura do ... while tiene la siguiente forma:

do {
...sentencias javascript ...
} while (condicion)

Como en la estructura while, aquí también se debe variar la condición dentro del bucle para que éste no se repita infinitas veces. El hecho de que la condición se escriba al finalizar el bucle hace que éste se ejecute siempre la primera vez, aunque la condición no se cumpla.

Veamos ahora una página de ejemplo muy parecida a la anterior, pero con la estructura do .. while:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Bucle do while</title> 
<script type="text/javascript">
function repite() {
         num = document.repetir.numero.value; //acceso a número escrito por el usuario
         num = Number(num); //convertir texto en número
         texto = document.getElementById("respuesta"); //elemento donde escribiremos
         texto.innerHTML =""
         i = 0; //condición inicial del bucle
         if (num<1 || num>20 || isNaN(num) == true ) { //si el número no es válido
            texto.innerHTML = "La siguiente frase no se repite porque no has escrito un número del 1 al 20.<br/>";
            }
         do {						
            i++; //variar la condición.
            texto.innerHTML += i + " Esta frase se escribe una vez y se repite el número de veces que tu indiques.<br/>";
            } while (i<num && num<=20) //repeticion hasta llegar al número de veces indicado.		
         }
</script>
</head>
<body>
<h1>Repetir una frase con el bucle do while</h1>
<form action="#" name="repetir">
<input type="text" name="numero"> Escibe un número del 1 al 20<br/><br/>
<input type="button" onclick="repite()" value="Pulsa para repetir" />
</form>
<p id="respuesta"></p>
</body>
</html>

Puedes ver como queda esta página de ejemplo pulsando en el siguiente enlace:

Ejemplo bucle do ... while





En la siguiente página veremos la estructura switch para condicionales múltiples.

La estructura switch







manual de Javascript

Anterior siguiente ... Siguiente siguiente


imprimir esta página

Página creada por ANYELGUTI.

Sugerencias: aprendeweb@aprende-web.net. Envia un manda un correo

Visita nuestro blog par saber en qué estamos trabajando: Aprende Web Blog

Más sobre anyelguti en http://anyelguti.16mb.com