Condizioni if, else, else if

Le condizioni if e else sono tra le operazioni più utilizzate nella programmazione, e non solo in JavaScript. Spesso, abbiamo bisogno di svolgere delle funzioni soltanto in alcune occasioni. In questa lezione, vediamo come funzionano le condizioni if, else e else if.

Condizione	Descrizione
`if`	Esegue il blocco se la condizione è vera.
`if` - `else`	Se la condizione è vera, esegue il blocco in `if`. Se è falsa, il blocco in `else`.
`if` - `else if` - `else` `if` ...	Se la condizione è vera, esegue il blocco in `if`. Se è falsa, il blocco in `else` `if` solo se la condizione associata è vera.

Condizione if

Tra le condizioni più semplici c'è quella di if. La sintassi è if(condizione){ blocco }.

let a = 1;

if(a == 1){
  // Blocco di istruzioni
}

Nell'esempio, il blocco delle istruzioni viene eseguito soltanto se la condizione è vera. In caso contrario, le istruzioni vengono ignorate. La condizione può essere scritta usando i simboli che abbiamo visto nella lezione delle comparazioni.

Vediamo un esempio di condizione if utilizzando un prompt e l'istruzione length dei metodi delle stringhe:

let parola = prompt("Inserisci una parola con 5 lettere:");

if(parola.length == 5){
  alert("Ottimo! Parola corretta");
}

Condizione else

Se le condizioni del blocco if non sono vere, allora possiamo svolgere un altro blocco: quello dell'else. La sintassi è:

if(codizione){
  // Blocco di istruzioni
} else {
  // Blocco di istruzioni
}

Se le condizioni contenute nell'if non sono vere, allora vengono eseguite le istruzioni all'interno dell'else. Vediamo un esempio, con un valore inserito dall'utente:

let numero = Number(prompt("Inserisci un numero:"));

if(numero>5){
  // La condizione è vera: il numero è maggiore di 5
  alert("Il numero e' maggiore di 5");
} else {
  // La condizione è falsa: il numero è minore/uguale a 5
  alert("Il numero e' minore di 5");
}

Condizione else if

L'ultima condizione predefinita di JavaScript è else if. Quando le condizioni dell'if non sono vere, allora si entra nel blocco else if solo se le condizioni di quest'ultimo sono vere. Vediamo un esempio per capire meglio.

let numero = Number(prompt("Inserisci un numero:"));

if(numero>5){
  // La condizione è vera: il numero è maggiore di 5
  alert("Il numero e' maggiore di 5");
} else if(numero<5) {
  // La condizione di else if è vera: il numero è minore di 5
  alert("Il numero e' minore di 5");
} else {
  // Le condizioni sono false: il numero è uguale a 5
  alert("Il numero e' uguale a 5");
}

Ecco cosa succede quando si utilizza else if:

Se le condizioni nell'if sono vere, viene eseguito il blocco dell'if e il resto viene ignorato.
Se le condizioni nell'if sono false, ma le condizioni nell'else if sono vere, viene eseguito il blocco dell'else if e il resto viene ignorato.
Se le condizioni nell'if sono false e le condizioni nell'else if sono false, vengono ignorati e viene eseguito il blocco dell'else.

Si possono avere anche diversi else if.

let numero = Number(prompt("Inserisci un numero:"));

if(numero>5){
  // La condizione è vera: il numero è maggiore di 5
} else if(numero<5) {
  // La condizione di else if è vera: il numero è minore di 5
} else if(numero==5) {
  // La condizione di else if è vera: il numero è uguale a 5
} else {
  // Le condizioni sono tutte false: non è un numero
}

Condizioni particolari per if, else e else if

Rispetto ai simboli di comparazione, questi blocchi hanno delle condizioni particolari che possono essere utilizzate.

Condizione	Descrizione
`if(`condizione `&&` condizione`)`	La condizione è vera solo se entrambe le condizioni sono vere.
`if(`condizione `\|\|` condizione`)`	La condizione è vera se almeno una delle due condizioni è vera.
`if(`variabile`)`	La condizione è vera se la variabile è diversa da `false` o `undefined`.
`if(!`variabile`)`	La condizione è vera se la variabile è uguale a `false` o `undefined`.

Condizioni con "&&" e "||"

Il simbolo && significa e (condizione1 e condizione2), mentre || significa oppure (condizione1 oppure condizione2). Vediamo un esempio con &&:

let parola = prompt("Inserisci una parola:");

if(parola != "" && parola.length>=5){
  // Se si entra qui, la parola non deve essere vuota e essere
  // lunga almeno 5 lettere
}

Ora vediamo un esempio con ||:

let parola = prompt("Inserisci una parola:");

if(parola == "Java" || parola.length>=4){
  // Se si entra qui, la parola è uguale a "Java" oppure lunga almeno 4 lettere
  // Esempi:
  //  - "Albero" --> vero (perché ha almeno 4 lettere)
  //  - "Java" --> vero (perché è uguale a "Java")
  //  - "Ma" --> falso (perché è diverso da "Java" ed ha meno di 4 lettere)
}

Possono anche essere inserite insieme:

let parola = prompt("Inserisci una parola:");

if(parola != "" && (parola == "Java" || parola.length>=4)){
  // Se si entra qui, la parola non è vuota e: è uguale a "Java" oppure lunga almeno 4 lettere
}

Altre condizioni

Vediamo ora le condizioni con sintassi if(variabile) e if(!variabile).

if(variabile) è vera se la variabile è uguale a true oppure esiste. Non può essere false o undefined.

if(parola){
  // La variabile parola esiste ed è diversa da false.
}

if(variabile) è vera se la variabile non esiste (undefined) oppure è false.

if(!parola){
  // La variabile parola non esiste ed è diversa da true.
}

Prova!Completa gli spazi vuoti con il testo appropriato.

// Controlla se A esiste ed è minore di 2. In questo caso, l'utente viene avvertito
if(A A > 2){
alert("A è maggiore di 2!");
}