Nell’articolo precedente della serie Programmiamo il Web con JavaScript, abbiamo visto come funzionano le strutture condizionali. Ma abbiamo anche detto che quelle strutture vanno bene per un controllo una tantum. Come fare quindi per ripetere una porzione di codice in loop finché una certa condizione sia vera? Se ad esempio stiamo programmando un Bancomat, come facciamo a dire al computer di non uscire dalla schermata del menu finché l’utente non preme su “Restituzione Carta”? Oppure come faccio a dire al computer di ripetere una certa azione per un numero di volte determinato dall’utente? Esiste un metodo, in programmazione, chiamato Ciclo. Che può essere for, do while e while. Vediamo come funziona in JavaScript

Le altre mini-lezioni su JavaScript:

I Cicli: Come funzionano

Un ciclo è un blocco di codice che si ripete in loop fin quando la condizione che lo ha introdotto è vera. Esistono tre tipi di ciclo in JavaScript: for, do while e while. Un esempio di ciclo è la conta fino a 10. Finché il contatore sarà inferiore a 10, il programma continuerà a contare. Eccovelo illustrato tramite il ciclo for:

for (var i = 1; i<= 10; i++) {
//stampiamo a schermo i numeri da 1 a 10
console.log(i);
}

Nell’esempio qua sopra ho usato il ciclo for, che è quello più usato in JavaScript. La prima riga inizializza la variabile i e dice al computer che il blocco di codice che segue deve essere ripetuto finché il suo valore non raggiunga 10. Poi incrementa il valore di i di uno (i++ equivale a dire i = i+1). Il blocco di codice invece è costituito da una sola riga, che stampa a video il valore di i.

Lavorando con cicli e strutture condizionali si possono eseguire programmini un po’ più complessi. Come ad esempio un programma di ricerca. Mettiamo il caso di voler cercare all’interno di un array un certo valore. Ad esempio, il nome “Roberto”.

var elenco = new Array(“Giuseppe”, “Valentina”, “Veronica”, “Claudio”, “Filippo”, “Roberto”, “Maria”);
var risultato = 0;

for(var i=0; i<elenco.length; i++){
if(elenco[i] = “Roberto”){ risultato = 1}
}
if(risultato = 1) {
console.log(“Roberto è presente nell’Array”);
} else{
console.log(“Roberto non è presente nell’Array”);
}

Il codice appena mostrato, effettua la scansione di tutti gli elementi di un Array finché ce ne sono e, se trova il nome “Roberto”, modifica il valore della variabile “risultato”. Alla fine del ciclo effettua un altro controllo; se “risultato” è uguale a 1, allora vuol dire che Roberto è stato trovato nell’Array, altrimenti comunica l’esito negativo. Ovviamente, i controlli incrociati ciclo/struttura condizionale possono essere eseguiti anche con i cicli do while e while.

I vari tipi di ciclo

Finora abbiamo parlato dei cicli facendo esempi con il ciclo for, ma in JavaScript esistono anche altri due tipi di ciclo: do while e while.

Il ciclo for

Il ciclo for è il tipo di ciclo mostrato negli esempi sopra. Ripete una porzione di codice fin quando la variabile inizializzata non raggiunga un determinato valore. Esso segue lo schema:

for (espressione iniziale ; condizione ; incremento) {
istruzioni
}

Quando viene eseguito, sostanzialmente ecco ciò che accade:

  1. Viene verificata l’espressione iniziale (solitamente l’inizializzazione di una variabile numerica);
  2. Viene verificata l’esistenza di una condizione da cui partire;
  3. Vengono eseguite le istruzioni nel blocco;
  4. Viene incrementata la variabile di riferimento;
  5. Si torna all’espressione iniziale.

Nel ciclo for, se l’espressione iniziale non collima con la condizione, il ciclo non viene eseguito.

Il ciclo do while

Il ciclo do while si ripete finché una certa condizione è vera. Esso segue il seguente schema:

do {
istruzioni
} while (condizione);

Nell’introduzione di questo articolo abbiamo fatto l’esempio di un Bancomat. Ora ve lo illustro:

/* Per semplificare la cosa, non sto a scrivere l’intero codice, che includerebbe tutta la parte grafica e altre funzioni di cui parleremo più avanti. In questo esempio mi limiterò a inizializzare la variabile scelta, invitandovi, qualora doveste copiare il codice per eseguirlo sul vostro browser, a cambiare il valore di volta in volta */

var scelta = 4;

do {
console.log(“Benvenuto nel Tuo Bancomat”);
console.log(“Effettua una scelta”);
console.log(“1 – Prelievo”);
console.log(“2 – Versamento”);
console.log(“3 – Estratto Conto”);
console.log(“4 – Restituzione Carta”);
//seguono le varie istruzioni relative alle funzioni scelte
if(scelta = 1) { ..blocco di codice..}
else if(scelta = 2) {..blocco di codice..}
else (if scelta = 3){..blocco di codice..}
} while(scelta != 4);  //il ciclo prosegue finché scelta è diverso da 4.

Il ciclo do non inizializza nessuna variabile e non effettua nessuna verifica prima del blocco. Quindi il blocco viene sempre eseguito almeno una volta.

Il ciclo while

È più simile al ciclo for, in quanto il blocco di istruzioni non viene eseguito se la condizione iniziale non è vera. Esempio:

var i = 1;
while(i<=10) {
console.log(i);
i++;
}

Se avete notato, c’è una differenza rispetto al ciclo for. Con il primo infatti, la variabile veniva incrementata nella riga d’istruzione principale, mentre qui il fatto avviene dentro al blocco di codice. Quindi bisogna sempre ricordarsi di aggiornare la variabile all’interno del blocco per non creare loop infiniti di istruzioni.

Il ciclo while è efficace quanto il ciclo for, tuttavia non è adatto per scorrere gli elementi all’interno di un Array, in quanto è adibito a eseguire un blocco di istruzioni finché un’istruzione è vera e basta.

Nel prossimo articolo dedicato alla programmazione web affronteremo un argomento molto importante, poiché costituisce il cuore pulsante di ogni applicazione JavaScript: le funzioni!

Ti è piaciuto questo articolo di Programmiamo il Web con JavaScript?  Resta sintonizzato per seguire gli altri articoli della serie! Contattami su Facebook o su Twitter e parliamone insieme! E se non vuoi perderti gli aggiornamenti del blog, iscriviti al canale Telegram!  Ah, ti ricordo che io scrivo anche per i blog di Stolas Informatica e Satyrnet, occupandomi principalmente, almeno in questo periodo, di sicurezza informatica, ma non solo. Facci un salto!

Facebook Comments