Ambito delle variabili in if-else in JavaScript

Per semplicità, supponiamo di avere una condizione sempre vera:

javascriptif (true) {
  
}

Consideriamo il seguente codice:

javascriptif (true) {
  let res = '!';
}

console.log(res);

Come puoi vedere, il valore '!' dovrebbe essere assegnato alla variabile res. Tuttavia, se esegui questo codice, in console verrà visualizzato un errore!

Il fatto è che le variabili dichiarate all'interno delle parentesi graffe sono visibili solo all'interno di quelle parentesi e non sono visibili all'esterno. In termini tecnici, si parla di ambito delle variabili.

Si può dire che l'ambito delle variabili dichiarate all'interno delle parentesi graffe sia limitato a quelle stesse parentesi graffe. Tuttavia, se una variabile è dichiarata all'esterno delle parentesi graffe, è visibile sia all'interno che all'esterno di esse:

javascriptlet res; // la variabile è dichiarata all'esterno

if (true) {
  res = '!';
}

console.log(res); // visualizzerà '!'

Nel seguente esempio, alla variabile res viene assegnato, a seconda della condizione, o il valore 1, o il valore 2:

javascriptlet num = 5;

if (num >= 0) {
  let res = 1;
} else {
  let res = 2;
}

console.log(res);

Tuttavia, se esegui questo codice, in console verrà visualizzato un errore. Come ora avrai capito, il problema è la visibilità delle variabili. Per risolvere il problema, dichiariamo la variabile all'esterno della condizione:

javascriptlet test = true;
let res; // dichiariamo la variabile all'esterno della condizione

if (test) {
  res = 1;
} else {
  res = 2;
}

console.log(res); // visualizzerà 1

javascriptlet age = 17;

if (age >= 18) {
  let adult = true;
} else {
  let adult = false;
}

console.log(adult);