Oblast viditelnosti proměnných v if-else v JavaScriptu

Pro jednoduchost mějme vždy platnou podmínku:

javascriptif (true) {
  
}

Podívejme se na následující kód:

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

console.log(res);

Jak vidíte, do proměnné res by se měla zapsat hodnota '!'. Avšak, pokud tento kód spustíte, do konzole se vypíše chyba!

Jde o to, že proměnné deklarované uvnitř složených závorek jsou viditelné pouze uvnitř těchto závorek a nejsou viditelné vně. Odborně se zde hovoří o oblasti viditelnosti proměnných.

Lze říci, že oblastí viditelnosti proměnných deklarovaných uvnitř složených závorek jsou pouze tyto složené závorky. Avšak, pokud je proměnná deklarována vně složených závorek, je viditelná jak uvnitř nich, tak vně:

javascriptlet res; // proměnná deklarována vně

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

console.log(res); // vypíše '!'

V následujícím příkladu se do proměnné res v závislosti na podmínce zapíše buď hodnota 1, nebo hodnota 2:

javascriptlet num = 5;

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

console.log(res);

Avšak, pokud tento kód spustíte, do konzole se vypíše chyba. Jak nyní již chápete, jde o viditelnost proměnných. Pro řešení problému deklarujme proměnnou vně podmínky:

javascriptlet test = true;
let res; // deklarujeme proměnnou vně podmínky

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

console.log(res); // vypíše 1

javascriptlet age = 17;

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

console.log(adult);