AnteriorPosterior

3.5. Condiciones repetitivas 2: do-while

  Curso: JavaScript para impacientes, por Nacho Cabanes

JavaScript para impacientes - 3.5. Condiciones repetitivas 2: do-while


(Si no lo has leído antes, posiblemente te interesará el apartado anterior)

Cuando queremos que algo se repita al menos una vez, lo que hemos hecho es "dar una primera pasada" y luego repetir con "while":

<html>
<body>
Dividiendo numeros...
<script>
    var n1 = prompt("Dime un numero");
    var n2 = prompt("Dime otro numero");
    while (n2 == 0)
    {
        n2 = prompt("No debe ser cero. Dime otro");
    }
    document.write(n1 + " dividido entre "+ n2 + " es: ");
    var resultado = parseInt(n1) / parseInt(n2);
    document.write(resultado);
</script>
</body>
</html>
 

Pero tenemos también otra construcción un poco más natural: do-while, en la que la condición se comprueba al final, no al principio, de modo que no es necesaria esa "primera pasada":

<html>
<body>
Dividiendo numeros con do-while...
<script>
    var n1 = prompt("Dime un primer numero");
    var n2;
    do
    {
        n2 = prompt("Dime el segundo numero (no debe ser cero)");
    }
    while (n2 == 0);
    document.write(n1 + " dividido entre "+ n2 + " es: ");
    var resultado = parseInt(n1) / parseInt(n2);
    document.write(resultado);
</script>
</body>
</html>
 

Ejercicios propuestos
  • 03.05.01 - Crea una página web que muestre los números pares del 10 al 20 (ambos incluidos), usando "do-while"
  • 03.05.02 - Crea una página que pida al usuario una serie de números, hasta que se pulse Intro sin escribir nada (se introduzca una cadena vacía), momento en el que se dejará de pedir datos y se mostrará la suma de todos ellos. Esta variante debe usar do-while, en vez de while.
  • 03.05.03 - Crea una página web que pida al usuario su nombre y su contraseña, y se repita hasta que introduzca como nombre "Juan" y como contraseña "1234", usando do-while en vez de while.

3.6. Contadores con "for"

Existe una tercera forma de comprobar condiciones repetitivas: la orden "for". Internamente, se parece muchísimo a un "while", como veremos en los próximos dos ejemplos, pero se use usar para contar, por analogía con otros lenguajes de programación.
Primero veamos esa analogía: en lenguajes como BASIC, se puede contar del 1 al 10 con la orden "FOR X = 1 TO 10", que se podría traducir como "para x que va a tomar valores desde 1 hasta 10". Si queremos avanzar de 2 en 2, sería algo como "FOR X = 1 TO 10 STEP 2". En lenguajes que derivan de C (como es el caso de JavaScript), la sintaxis, aunque recuerda a ésta, es un poco más complicada: la orden "for" tendrá 3 partes, separadas por "punto y coma":
  • La primera parte dará un valor incial a una variable (por ejemplo, "x = 1")
  • La segunda detallará qué condición se debe repetir (por ejemplo, " x <= 10")
  • La tercera parte será la que se encargue de pasar de un valor de la variable al siguiente (como podría ser "x = x+1" o bien "x++" si queremos avanzar de uno en uno, y "x = x+2" o "x+=2" para avanzar de dos en dos.
Suena difícil, pero no lo es tanto. Primero vamos a recordar cómo podíamos contar usando "while" (usando la forma abreviada para incrementar el valor de la variable que hace de contador):

<html>
<body>
Vamos a contar con "while"... 
<script>
    var contador = 1;
    while (contador <= 10)
    {
        document.write(contador + " ");
        contador++;
    }
</script>
</body>
</html>
 

Convertir esto a un "for" es relativamente sencillo:

<html>
<body>
Vamos a contar con "for"... 
<script>
    var contador;
    for (contador = 1; contador <= 10; contador++)
    {
        document.write(contador + " ");
    }
</script>
</body>
</html>
 

Ejercicios propuestos
  • 03.06.01 - Crea una página web que muestre los números del 1 al 20 (ambos incluidos), usando "for"
  • 03.06.02 - Crea una página web que muestre los números del 1 al 16, (ambos incluidos), saltando de 3 en 3, usando "for"
  • 03.06.03 - Muestra los números pares del 10 al 20 (ambos incluidos), usando "for"
  • 03.06.04 - Muestra los números del 15 al 5, descendiendo (ambos incluidos), usando "for"
  • 03.06.05 - Escribe los múltiplos del 5 que hay entre el 5 y el 50 (ambos incluidos), usando "for"
  • 03.06.06 - Escribe los múltiplos de 3 que hay entre el 50 y el 5 (ambos incluidos), descendiendo, usando "for"
Pista: para hallar los múltiplos de 5, se puede comenzar en 5, y sumar 5 en cada pasada. Otra alternativa es calcular el resto de la división: si al dividir el número entre 5 se obtiene resto 0, quiere decir que era un múltiplo de 5. Tenemos un operador para calcular el resto de la división (que también se conoce como "la operación módulo"): el símbolo de porcentaje. "5 % 3" es la forma de escribir "el resto de dividir 5 entre 3", o simplemente "5 módulo 3":

<html>
<body>
Multiplos de 5... 
<script>
    var contador;
    for (contador = 1; contador <= 10; contador++)
    {
        if (contador % 5 == 0)
            document.write(contador + " ");
    }
</script>
</body>
</html>
 

3.7. ¿Cuándo usar cada tipo de condición repetitiva?

Casi cualquiera estructura repetitiva se podría usar para casi cualquier caso, pero, por su construcción, cada una resulta ligeramente más cómoda que las demás para un tipo de problema concreto:
  • "for" - Cuando sepamos cuantas veces queremos repetir algo, y usaremos un contador para hacerlo (por ejemplo, escribir 5 veces un texto)
  • "do-while" - Cuando algo se deba repetir al menos una vez (por ejemplo, pedir una contraseña)
  • "while" - Cuano se trate de algo repetitivo, pero que quizá no llegue a ocurrir nunca, como el mostrar datos de una base de datos... que podría estar vacía.
Ejercicios propuestos
  • 03.07.01 - Crea una página web que pida un número al usuario y muestre cuáles son sus divisores.
  • 03.07.02 - Pide un número y muéstralo como producto de sus factores primos (por ejemplo: 24 = 2*2*3). Para hacerlo de forma más mecánica, puede ayudarte que termine en "*1": 24 = 2*2*3*1
  • 03.07.03 - Genera al azar un número del 1 al 100 y da al usuario 6 oportunidades para adivinarlo.
  • 03.07.04 - Pide al usuario dos números y calcula cuanto es el primero elevado al seguno, usando multiplicaciones sucesivas. Por ejemplo. 2 elevado a 3 es lo mismo que 2*2*2, y su resultado es 8
  • 03.07.05 - Pide al usuario un ancho y un alto y dibuja un rectángulo formado por asteriscos, que tenga ese ancho y ese alto. Por ejemplo, para anchura 4 y altura 3 podría ser:
****
****
****
  • 03.07.06 - Crea un página web que calcule el cambio de una compra, utilizando monedas (o billetes) del mayor valor posible. Supondremos que tenemos una cantidad ilimitada de monedas (o billetes) de 100, 50, 20, 10, 5, 2 y 1, y que no hay decimales. La ejecución podría ser algo como:
Precio? 44
Pagado? 100
Su cambio es de 56: 50 5 1

Precio? 1
Pagado? 100
Su cambio es de 99: 50 20 20 5 2 2

Actualizado el: 08-03-2014 23:38

AnteriorPosterior