Ya hemos visto en un ejemplo (test online) de los apartados anteriores, cómo podíamos incluir un condicional if dentro de un bucle for o un bucle while . De forma parecida, también podemos hacer encadenamientos, es decir, incluir condicionales dentro de otros condicionales, o bucles dentro de otros bucles, creando distintos niveles dentro de esos bloques.

Encadenamiento de if

Cuando queramos que se cumplan condiciones complejas en un condicional, en vez de expresarlo en una sola expresión, puede sernos más sencillo o claro emplear un encadenamiento de condiciones if. Lo vemos con un ejemplo:
Condicional sin encadenamiento:

Podríamos escribir el script solo con instrucciones que contuvieran condiciones simples (solo se ha de cumplir una condición cada vez), encadenando o incluyendo uno dentro de otros:

Aunque a nivel de condiciones, quizás sea más fácil de entender la 2ª versión, nosotros preferiríamos utilizar la 1ª versión por ser más compacta, lo que al final y viendo el script en conjunto, creemos que lo hace más claro. No obstante, puede haber casos realmente complejos donde nos sea más fácil descomponer una condición en varios if. Lo importante, en cualquier caso, es que sepamos que podemos hacerlo de esta forma.

Encadenamiento de bucles

El incluir un bucle dentro de otro puede ser algo más común porque hay procesos que requieren que por cada valor del contador del bucle externo se recorra un rango de valores de un bucle interno. Suena quizás algo enrevesado pero con un ejemplo se puede visualizar mucho mejor:

Si ejecutas el ejemplo en el editor online verás como para cada día de las semana que hemos definido en un array (diaSemana[ ]), mostramos en pantalla las 24 horas de ese día. El bucle externo recorre los días de las semana desde lunes hasta domingo, y por cada uno de estos días, el bucle interno recorre las horas desde 0 a 23. Vamos a describirlo paso a paso:

• El bucle exterior toma en primer lugar el diaSemana[0], es decir, el primer valor del array: «Lunes».
• Se ejecuta la primera instrucción de ese bucle externo, que es un document.write, que muestra en pantalla dicho día y realiza un salto de linea con la etiqueta «<br>»
• A continuación se ejecuta el bucle interno que comienza a pintar en pantalla las horas del día.
• Hemos incluido un condicional para formatear mejor el resultado. Comprueba si la hora que va a mostrar en pantalla no es la última del día, es decir, 23: (hora !== 23). Si no lo es, muestra el nº de hora seguido por el texto «h.», y si lo es, hace lo mismo pero forzando un salto de línea con «<br>» para que empiece a mostrarse el siguiente día en otra línea.
• El bucle interno termina cada vez que se alcanza el limite de 23. En ese momento el exterior retoma el flujo del programa, seleccionando el dia siguiente dentro del array, y volviendo a realizarse todo el ciclo.

Ejercicio

Prueba a hacer algo similar, pero en esta ocasión muestra en pantalla los meses del año y en cada uno los días que tiene: 1, 2….. En una versión más simplificada puedes poner 30 días a todos los meses, y en otra, trata de poner los días que tienen exactamente cada uno: 28 (Febrero), 30 ó 31.

Soluciones:

[restrict paid=true]

[/restrict]