Site icon Tosolini.info

Guida a JavaScript: condizioni cicliche e flussi

Fino ad ora abbiamo esaminato, in modo per lo più accademico piuttosto che pratico, situazioni in cui ad una variabile si assegna un valore o si crea un array di dati, ma tutto sempre in modo lineare. Nel creare un programma è evidente che la possibilità dell’utente di effettuare delle scelte, che si tramutano in “prendere decisioni”, lo renda più interessante e funzionale a ciò che vogliamo creare.

Istruzione IF

IF, tradotto dall’inglese “se”, ovvero se una condizione è vera esegui una certo codice, se è falsa non eseguire nulla, ovvero salta il codice e prosegui.

var nome = "informatica";

if ( nome == "informatica") {
  alert("benvenuti nel mio sito");
}

come vediamo qui sopra si inizia con la dichiarazione di IF seguita dalla condizione racchiusa nelle parentesi tonde, mentre nelle parentesi graffe deve essere indicato il codice da eseguire in caso di condizione true. Nel caso specifico la variabile nome viene confrontata con una stringa attraverso l’operatore [textmarker color=”CFCFCF”] == [/textmarker] che significa il valore A è uguale al valore B?

Ovviamente non esiste solo l’operatore di eguaglianza.

[row][third_paragraph] Operatore [/third_paragraph][third_paragraph] Esempio [/third_paragraph][third_paragraph] Conseguenza vera (true) [/third_paragraph][/row]
[row][third_paragraph] > [/third_paragraph][third_paragraph] A > B [/third_paragraph][third_paragraph] A è maggiore di B [/third_paragraph][/row]
[row][third_paragraph] < [/third_paragraph][third_paragraph] A < B [/third_paragraph][third_paragraph] A è minore di B [/third_paragraph][/row]
[row][third_paragraph] >= [/third_paragraph][third_paragraph] A >= B [/third_paragraph][third_paragraph] A è maggiore o uguale di B [/third_paragraph][/row]
[row][third_paragraph] <= [/third_paragraph][third_paragraph] A <= B [/third_paragraph][third_paragraph] A è minore o ugale di B [/third_paragraph][/row]
[row][third_paragraph] == [/third_paragraph][third_paragraph] A == B [/third_paragraph][third_paragraph] A è uguale di B [/third_paragraph][/row]
[row][third_paragraph] != [/third_paragraph][third_paragraph] A != B [/third_paragraph][third_paragraph] A è diverso di B [/third_paragraph][/row]
[row][third_paragraph] ! [/third_paragraph][third_paragraph] !A [/third_paragraph][third_paragraph] Il valore booleano di A è false [/third_paragraph][/row]

Quindi sarà possibile confrontare in modo abbastanza ampio alcune condizioni che riguardano le variabili. Ma, come ho ricordato negli altri articoli, Javascript cerca sempre la via minore nell’eseguire le cose. Nel caso dovessimo fare più scelte che comunque abbiano in comune l’esecuzione di un codice, ci possiamo avvalere delle condizioni multiple attraverso le scelte AND con il simbolo [textmarker color=”CFCFCF”] && [/textmarker] e la scelta OR con il simbolo [textmarker color=”cfcfcf”] || [/textmarker]. Vediamo un esempio per essere più esaustivi.

var nome = "informatica";

if (nome == "escursionismo" || nome == "fotografia" || nome == "informatica") {
  alert ("Benvenuti nel mio sito");
}

Nel caso sopra la variabile nome è stata confrontata più volte ed è bastata che una di queste (OR) sia vera per tornare il valore TRUE alla condizione IF. Se avessimo utilizzato AND come condizione multipla, allora tutte e tre le condizioni di eguaglianza dovevano essere soddisfatte per avere TRUE.

Istruzione IF – ELSE

Aggiungiamo un altro mattoncino, nel caso una condizione sia vera eseguo un codice, ma se nel caso sia falsa non voglio che il tutto sia saltato ma voglio eseguire un secondo codice. In questo caso espandiamo la condizione IF (se) con ELSE (allora). Se parlassimo al codice diremmo. “Se la condizione è soddisfatta faccio una cosa, altrimenti ne faccio un altra“. Vediamo nel concreto il codice:

var nome = "informatica";

if (nome == "informatica") {
  alert("sei nella sezione informatica");
} else {
  alert("sei nella sezione escursionismo");
}

Nell’esempio soprastante viene in qualche modo decretato una sorta di valore booleano, poiché di fatto è come se si confrontasse la variabile nome con un TRUE o FALSE. Ma questa condizione non è rigida ed è possibile estenderla aggiungendo dei livelli intermedi.

Istruzione ELSE-IF

Prendiamo l’esempio precedente, ma lo estendiamo.

var nome = "informatica";

if (nome == "informatica") {
  alert("sei nella sezione informatica");
} else if (nome == "escursionismo") {
  alert("sei nella sezione escursionismo");
} else {
  alert ("sei nella sezione fotografia");
}

In questo caso abbiamo inserito un livello di confronto intermedio. Se potesse parlare direbbe “se nome è uguale  ad informatica faccio qualcosa, altrimenti se è uguale ad escursionismo, faccio qualcos’altro, altrimenti è fotografia“. Quindi i cicli ELSE IF possono essere infiniti e tutti dovranno terminare obbligatoriamente con l’istruzione ELSE.

Ciclo WHILE

Fino ad ora abbiamo visto delle condizioni di comparazione su una variabile, che possono essere estese con comparazioni multiple attraverso AND e OR. Nel caso degli Array dove non è detto che si conoscano i valori della variabile possono tornare utili i cicli.
Il programma quando incontra per la prima volta il ciclo verifica la condizione, se questa è vera viene eseguito il codice condizionale e il dato trattato viene rimandato alla condizione. Questo accadrà tutto il numero di volte finché la condizione non sarà FALSE e potrà continuare. Se sbagliamo a scrivere il codice e la condizione non diventerà mai FALSE andrà a generare un errore, ad esempio vi sarete imbattuti talvolta nel messaggio “questo script richiede un tempo molto lungo per la propria esecuzione” ed è probabile, ma non certo, che sia proprio una istruzione WHILE non soddisfatta.

var numeri = [1, 2, 3, 4, 5, 6, 7, 8, 9];
var i= 0;

while (i < numeri.lenght) {
  alert ("condizione vera");
  i++;
}

Analizzando il codice vediamo che viene creato un Array di numeri, una variabile i (che fa da contatore) con valore 0. Il ciclo inizia ad esaminare, se la variabile è minore della lunghezza degli elementi di numeri (cioè 9), essendo questo vero andrà ad eseguire il codice, ovvero aumenterà di uno la variabile i che diventerà uno e così via. Questo ciclo si interromperà quando i avrà 9 come valore.

NOTA: in Javascript si utilizza la variabile i come iniziale di incremento molto di frequente. Per cui è necessario che via abituiate ad utilizzare come contatore questa convenzione non dichiarata.

Ciclo DO WHILE

La funzione DO WHILE è praticamente inutilizzata in Javascript. Diciamo che il codice condizionale è messo prima della condizione e non dopo, quindi almeno una volta tale codice viene eseguito.

L’istruzione viene scritta così:

var numeri = [1, 2, 3, 4, 5, 6, 7, 8, 9];
var i = 0;

do {
  alert ("condizione vera");
  i++;
} while (i < numeri.lenght) {
  i + 2;
}

Ciclo FOR

I cicli FOR invece sono piuttosto utilizzati e sono molto simili concettualmente a WHILE ma permettono di comprimere concettualmente il codice.
Prendendo come esempio quello di WHILE

var numeri = [1, 2, 3, 4, 5, 6, 7, 8, 9];
var i= 0;

while (i < numeri.lenght) {
  alert ("condizione vera");
  i++;
}

Lo potremo trasformare in

var numeri = [1, 2, 3, 4, 5, 6, 7, 8, 9];
  for (var i= 0; i < numeri.lenght; i++){
  alert ("condizione vera");
}

decisamente meno lunga e forse meno complicata della precedente. In sostanza il concetto di funzionamento è molto simile al primo IF con l’operatore AND. In questo caso viene dichiarata una variabile i a valore 0, quindi confrontata con la lunghezza di un array ed aumentata di uno. La sequenza degli eventi come già descritto nell’articolo delle variabili, avviene da sinistra verso destra.

Conclusioni

In questo breve articolo abbiamo esaminato come sia possibile eseguire un codice al verificarsi di una data condizione. Come ciò sia ripetibile in cicli condizionali. Nel prossimo articolo vedremo come questi codici potranno essere riutilizzati attraverso le Funzioni.

Exit mobile version