Nel linguaggio JavaScript esistono vari modi per ripetere l’esecuzione dello stesso codice a seconda che siano soddisfatte delle condizioni. Anche l’attesa della digitazione di un tasto su un device richiede spesso che si legga continuamente la memoria dove viene registrato il valore del tasto, se premuto.
I tre modi di ripetere le istruzioni in JavaScript sono for, while e do.
JavaScript Ciclo For e Break
Nel software serve spesso verificare delle condizioni ripetutamente, in un ciclo che s’interrompe quando serve. In inglese il ciclo si chiama loop ed è questo il nome che prendono le istruzioni di questo tipo. Ce n’è più di una, in quanto esistono vari modi di verificare le condizioni.
Con riferimento agli esempi precedenti, diciamo che bisogna inserire tre spese diverse. Hai visto che il prompt fa uscire una finestra nella quale digitare il dato richiesto. Per farlo tre volte puoi copiare il prompt tre volte di fila, ma esteticamente è brutto e poi va bene solo per pochi inserimenti.
Invece, tornando sullo stesso blocco di istruzioni puoi ripeterle un numero di volte a piacere.
Dovrai usare una variabile come contatore, eseguire il codice e aggiungere 1 al contatore, confrontando il contatore con il numero di ripetizioni che ti occorrono. Così andrai ad eseguire le stesse istruzioni per un certo numero di volte, a condizione che il contatore sia minore o uguale al numero di ripetizioni.
In inglese “per” si dice for, ed ecco spiegato il nome della prima struttura di ripetizione di codice: ii ciclo for in JavaScript.
Ipotizza di voler lanciare il prompt per numero 6 volte:
let numero = 6; let contatore = 0; for (contatore = 1; contatore <= numero; contatore = contatore + 1) { console.log(“Dammi il numero di contatore” + contatore); } const numero = 6; let contatore = 0; let valori = new Array(0,0,0,0,0,0,0); //sette zeri for (contatore = 1; contatore <= numero; contatore = contatore + 1) { valori[contatore] = Number(prompt("Dammi il numero di contatore " + contatore)); console.log("Il valore " + valori[contatore] + " è il numero " + contatore + " di 6"); }
In questo semplice programma dichiariamo valori, l’array JavaScript di 7 elementi, e usiamo contatore con il for per ripetere le istruzioni un numero di volte da 1 a numero (che è una costante pari a 6).
Per ricordarlo, nella riga di dichiarazione dell’array trovi // (due slash) e poi un memo. In questo modo, si possono inserire commenti all’interno del software. I commenti sono essenziali, perché spiegano cosa si sta per fare e rendono semplice modificare ed aggiornare il software quando dovesse servire – e servirà, stanne pur certo! –
Per usare un contatore da 1 a 6 abbiamo usato un array JavaScript di 7 elementi, perché tutti i conteggi, in genere, partono da 0. Anche i nomi usati sono di tipo discorsivo.
La versione normale di questo programma sarebbe:
const n = 6; let c = 0; let v = new Array(0,0,0,0,0,0,0); //sette zeri for (c = 0; c < n; c += 1) { v[c] = Number(prompt("Dammi il numero di contatore " + c)); console.log("Il valore " + v[c] + " è il numero " + c + " di 6"); }
Analizza bene il codice: non noti qualcosa che non conosci?
La console eseguirà quel codice nel modo che vedi nella prossima immagine.
I parametri del for sono molto simili a quelli che hai visto con l’if.
for (c = 0; c < n; c = c + 1)
chiede di ripetere il {codice tra graffe} finché la variabile un numero n di volte.
Il ciclo for JavaScript che abbiamo visto finora esce dal programma solo quando il ciclo è stato terminato. Alle volte, però, è comodo inserire una possibilità di fuga! Per fare questo, il linguaggio JavaScript usa l’espressione break.
Inserisci nel codice precedente la possibilità (con l’ if in JavaScript visto in precedenza) di terminare l’esecuzione senza aver inserito i 6 numeri, verificando se l’ultimo numero inserito con prompt è zero.
const n = 6; let c = 0; let v = new Array(0,0,0,0,0,0,0); // sette zeri for (c = 0; c < n; c = c + 1) { v[c] = Number(prompt("Dammi il numero di contatore " + c)); console.log("Il valore " + v[c] + " è il numero " + c + " di 6"); if (v[c] == 0) { // ecco la via d’uscita break; } }
Nota che il break viene eseguito verificando una condizione logica, nella quale l’uguaglianza è rappresentata con ==, il doppio uguale .
Ciclo While JavaScript
Abbiamo visto il ciclo for JavaScript, ma i flussi iterativi non finiscono mica qui!
Andiamo ad analizzare, infatti, il prossimo: il ciclo While in JavaScript.
Il while (finché) somiglia molto ad un ciclo for JavaScript, con l’incremento del contatore portato fuori dalla sua dichiarazione.
Il seguente codice è quasi equivalente a quello con il for che hai visto in precedenza.
const n = 6; let c = 0; let v = new Array(0,0,0,0,0,0,); // sette zeri while (c < n) { v[c] = Number(prompt("Dammi il numero di contatore " + c)); console.log("Il valore " + v[c] + " è il numero " + c + " di 6"); c = c + 1; // incremento del contatore }
Ovviamente il ciclo while in JavaScript ha delle differenze dal ciclo for, ma queste esulano dagli obiettivi della presente guida.
Ciclo Do-While JavaScript
Tenendo bene a mente quanto detto nei precedenti capitoli, introduciamo un altro attore dei flussi iterativi in JavaScript. Parliamo, in primo luogo, del do.
Anche il do svolge iterazioni, ma esegue {il suo codice} almeno una volta, perché il controllo è posto dopo {il suo codice}.
Il do è una struttura di controllo che prevede anche l’uso di while. Questo ciclo esegue sempre {il suo corpo} almeno una volta e inizia a verificare se deve interrompersi solo dopo quella prima esecuzione. Per riflettere ciò, il test appare dopo il corpo del ciclo.
const n = 6; let c = 0; let v = new Array(0,0,0,0,0,0); /* ora gli zeri sono sei */ do { v[c] = Number(prompt("Dammi il numero di contatore " + c)); console.log("Il valore " + v[c] + " è il numero " + c + " di 6"); c = c + 1; // incremento del contatore } while (c < n);
Anche qui c’è qualcosa che dovresti notare…