JavaScript02

Guida alle "STRUTTURE DI CONTROLLO"

STRUTTURE DI SELEZIONE CONDIZIONALE

Normalmente, il flusso dei programmi JavaScript è SEQUENZIALE: le istruzioni vengono eseguite
una dopo l'altra, nell’ordine in cui compaiono. Per modificare questo normale flusso,
bisogna farlo esplicitamente, per esempio inserendo una istruzione, o una funzione che viene
chiamata solo se una data condizione risulta vera.

Uno degli approcci più comuni per modificare il normale flusso di esecuzione del codice JavaScript
è l'uso delle istruzioni di selezione condizionale.

if (CondizioneVerificata) {

          esegui queste istruzioni ...

    }

Il termine condizionale deriva dal fatto che una condizione deve essere soddisfatta
prima che il blocco di codice associato all’istruzione venga eseguito. L’esempio precedente significa:

se un certo valore (valore letterale, variabile o espressione) risulta vero (CondizioneVerificata),
allora esegui il blocco di codice racchiuso tra le parentesi graffe;
in caso contrario, salta il blocco e prosegui con l’istruzione immediatamente successiva.

La parola riservata if segnala l’inizio dell’istruzione condizionale
e l’espressione tra parentesi tonde rappresenta la selezione condizionale.

In JavaScript abbiamo tre diversi tipi di istruzione per la selezione condizionale.

    if
    if...else
    switch

Iniziamo dalla più semplice If Conviene utilizzare if se si vuole che un’azione venga eseguita se una condizione è vera. La condizione può essere una espressione booleana. Se la condizione restituisce true come valore, viene eseguito il blocco di istruzioni, altrimenti non viene eseguito alcun codice.


Sintassi

if (condizione)
  {
    codice da eseguire se la condizione è vera;
  }

Esempio

<script type=" text/javascript ">
  var x = 1 ;
  var y = 2 ;
  if (x < y)
  {
     document.write( "y è più grande" );
  }
</script>

L'immagine che segue raffigura quanto appena detto

immagine if

If...else Se si vuole che un’azione venga eseguita se una condizione è vera, ed un’altra se la condizione è falsa, occorre utilizzare l’istruzione if..else. Il blocco di istruzioni dopo l'else saranno eseguite qualora la condizione dovesse risultare falsa.


Sintassi

if (condizione)
  {
    codice da eseguire se la condizione è vera;
  }
else
  {
    codice da eseguire se la condizione è falsa;
  }

Esempio

<script type=" text/javascript ">
  var x = 1 ;
  var y = 1 ;
  if (x < y)
  {
     document.write( "y è più grande" );
  }
else
  {
     document.write( "y non è più grande" );
  }
</script>

Possiamo combinare più istruzione if..else
per necessità particolari nel seguente modo:

if (condizione1)
  {
    codice da eseguire se la prima condizione è vera;
  }
else if (condizione2)
  {
    codice da eseguire se la seconda condizione è vera ;
  }
else
  {
    codice da eseguire se le due condizioni sono false;
  }

L'immagine che segue raffigura quanto appena detto

immagine if else

Switch Utilizzare questa istruzione se si vuole confrontare una espressione con una serie di valori. Abbiamo una espressione (spesso una variabile) che viene valutata una volta, il valore dell’espressione viene confrontato con ciasun valore dei case della struttura, se c'è una corrispondenza, il blocco di codice associato viene eseguito. Utilizzate break per fare in modo che venga eseguito il codice del prossimo blocco case.


Sintassi

  switch (espressione) //valutazione della variabile
  {
    case variabile1:
       codice da eseguire se espressione = variabile1
       break
    case variabile2:
       codice da eseguire se espressione = variabile2
       break
    case variabile3:
       codice da eseguire se espressione = variabile3
       break
    default :
       codice da eseguire se espressione è diversa da ciascun case
  }

Esempio

<script type=" text/javascript ">
  var data = new Date ()
  oggi = data. getDay ()
  switch ( oggi )
  {
     case 0 :
       document.write("Oggi è domenica")
       break          
    case 1 :          
       document.write("Oggi è lunedì")
       break          
    case 2 :          
       document.write("Oggi è martedì")
       break          
    case 3 :          
       document.write("Oggi è mercoledì")
       break          
    case 4 :          
       document.write("Oggi è giovedì")
       break          
    case 5 :          
       document.write("Oggi è Venerdì")
       break          
    case 6 :          
       document.write("Oggi è Sabato")
       break         
     default :       
       document.write("mmm... non dovresti essere qui")
  }
</script>

STRUTTURE DI CONTROLLO: CICLI RIPETITIVI

I Cicli Ripetitivi sono usati per eseguire dei blocchi di codice un certo numero di volte. Possono essere utili per eseguire dei conteggi oppure per eseguire del codice un numero variabile di volte in base a dei parametri

 
 In JavaScript abbiamo tre diversi tipi di costrutti,
 per i Cicli Ripetitivi.
 
    ciclo for
    while
    do...while

Iniziamo dalcostrutto for Il ciclo FOR La sintassi di questo ciclo è la seguente: esegue le istruzioni un numero determinato di volte fissato dai valori di: inizializzazione condizione incremento

  
  for (inizializzazione; condizione; incremento){
        ... istruzioni ...
  }

//Esegue una serie di comandi fino a che non è stato raggiunto il limite indicato da una condizione. La prima espressione(inizializzazione) dice da dove inizializzare la variabile contatore; la seconda espressione(condizione) pone il limite condizionale entro il quale l'istruzione deve essere ripetuta; mentre l'ultima espressione(incremento) dice al ciclo di quanto deve incrementare o decrementare la variabile iniziale. Ad esempio molto utile e' il ciclo che serve ad inizializzare un array (nel nostro caso prendiamo un array di 10 elementi):

  
  for (i=0; i<10; i++){
    array[i]=0;
  }

ricordiamo che gli array iniziano a contare da 0 per cui quando il contatore assume valore 10 il ciclo non è ripetuto.

L'immagine che segue raffigura quanto appena detto

immagine for

Il ciclo WHILE Ripete le istruzioni finchè una condizione è vera.

  while (condizione){
    ... istruzioni ...
    }

Esempio

<script type=" text/javascript ">
  x = 0
  while (x<10 ){
    document.writeln( "x = " + x );
    x++; /*Incremento del valore di x*/
  }
</script>

L'immagine che segue raffigura quanto appena detto

immagine while

Il ciclo DO...WHILE Esegue una volta il blocco e poi Ripete le istruzioni finchè una condizione è vera. Rispetto al while siamo sicuri ce il codice venga eseguito almeno una volta.

  do {
    ... istruzioni ...
  }
  while (condizione)

Esempio

<script type=" text/javascript ">
  x = 0
  do {
    document writel  "x = " + x);
    x++; /*Incremento del valore di x*/
    while (x<10 )
  }
</script>

L'immagine che segue raffigura quanto appena detto

immagine do_while

ALTRE ISTRUZIONI

  
  Operatore Condizionale ?
  
  JavaScript contiene anche un operatore condizionale che assegna
  un valore ad una variabile in base a delle condizioni.
  
  Il simbolo ? viene utilizzato come un if.
  La sua sintassi è la seguente:
  
  (Espressione1) ? (Espressione2) : (Espressione3)
  
  Per cui se è vera la prima espressione viene eseguita la seconda,
  se falsa viene eseguita la terza.
  
  Sintassi
  
  nomeVariabile = (condizione) ? valore1: valore2
  
  Esempio
  
  <script type=" text/javascript ">
  var Max = (x > y) ? "Primo" : "Secondo"
  </script>

for..in

Esegue una serie di istruzioni
 per ogni proprietà di un oggetto.

  for (Proprieta in Oggetto){
    ... istruzioni ...
    }

Esempio

<script type=" text/javascript ">
  var mioOggetto = vettore;
  var valoreMiaProprieta;
  for (posizioneOggetto in mioOggetto)
  //non serve definire posizioneOggetto prima del suo uso
  {
    valoreMiaProprieta = mioOggetto[posizioneOggetto];
    document.write(mioOggetto[posizioneOggetto] + 
    " = " + valoreMiaProprieta + "<br/>")
</script>


break e continue

Sono due istruzioni utili per cambiare la normale esecuzione di cicli e istruzioni condizionali.
Break
termina l'esecuzione del ciclo dell'istruzione condizionale, mentre
continue
passa all'iterazione successiva.

Esempio
Il primo cliclo si fermerà a 5, mentre il secondo salterà il valore 5 che non sarà stampato

  

<script type=" text/javascript ">
  for (i= 1 ; i< 10 ; i++){
     if(i == 5)
     break ;
     document.write (i + ", ");
  }
  document.write("<br/>");
  for (i= 1 ; i< 10 ; i++){
     if(i == 5)
     continue ;
     document.write(i + ", ");
  }
</script>