|
Come per le altre strutture di controllo, è possibile annidare più cicli for uno dentro l'altro: l'unica cosa essenziale è che non ci siano sovrapposizioni fra i cicli, cioé occorre chiudere per primo il ciclo più interno, come si fa per le parentesi.
I cicli nidificati sono molto utili in numerosi problemi di matematica, come vedremo.
|
Costruiamo la tabellina della moltiplicazione per i numeri che vanno da 1 a 10.
Nella prima riga scriveremo il prodotto di tutti i numeri da 1 a 10 per 1; nella seconda riga il prodotto di tutti i numeri da 1 a 10 per 2 e così via. E' chiaro che in questo caso abbiamo bisogno di due indici: uno per le righe ed uno per le colonne.
Indichiamo con i l'indice per le righe, e con j quello per le colonne.
Prepariamo la funzione JavaScript che ci occorre con il seguente codice, da inserire fra i tags <HEAD> ed </HEAD> :
<script language=JavaScript>
function tabellina0() {
for (i=1; i<=10; i=i++) {
for (j=1; j<=10; j++) {
document.write(i*j+' ')
}
document.write('<br>')
}
}
</script>
Controlliamo la corretteza del programma attraverso la tavola di traccia, calocata, per semplicità, per valori di i fino a 3 e per valori di j fino a 2.
| azione |
indice 1 |
condizione |
indice 2 |
condizione |
prodotto i*j |
|
i |
i<=3 |
j |
j<=2 |
| 1° |
1 |
vera |
|
|
|
| 2°- 3° |
|
|
1 |
vera |
1*1=1 |
| 4°- 5° |
|
|
2 |
vera |
1*2=2 |
| 6° |
|
|
3 |
falsa |
|
| 7° |
2 |
vera |
|
|
|
| 8°- 9° |
|
|
1 |
vera |
2*1=2 |
| 10°- 11° |
|
|
2 |
vera |
2*2=4 |
| 12° |
|
|
3 |
falsa |
|
| 13° |
3 |
vera |
|
|
|
| 14°- 15° |
|
|
1 |
vera |
3*1=3 |
| 16°- 17° |
|
|
2 |
vera |
3*2=6 |
| 18° |
|
|
3 |
falsa |
|
| 19° |
4 |
falsa |
|
|
|
Come si vede, viene dato inizialmente all'indice i il valore 1, quindi si avvia il ciclo interno ( j prende successivamente i valori
- e viene scritto il primo prodotto;
- e viene scritto il secondo prodotto;
- a questo punto j ha superato il valore massimo e si esce dal ciclo interno)
Ora i prende il valore 2, e si torna al ciclo interno... e così via.
Creiamo un bottone con il seguente codice, da inserire fra i tags <BODY> e </BODY> :
<form name="MioForm0">
<input type=button value="Primo esempio" name="botton0" OnClick="javascript:tabellina0()">
</form>
Otteniamo il seguente risultato:
Si vede, premendo il pulsante, che i numeri scritti sono esatti, ma non sono allineati come vorremmo. Per ottenere una visualizzazione migliore, dovremo inserire i prodotti in una tabella.
|