Muuttujien näkyvyysalue if-else -lauseissa JavaScriptissä

Oletetaan yksinkertaisuuden vuoksi, että meillä on aina toteutuva ehto:

if (true) {
	
}

Tarkastellaan seuraavaa koodia:

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

console.log(res);

Kuten näet, muuttujaan res pitäisi tallentua arvo '!'. Kuitenkin, jos suoritat tämän koodin, konsoliin tulostuu virhe!

Asia on siinä, että muuttujat, jotka on määritelty aaltosulkeiden sisällä, ovat näkyvissä vain niiden sisällä, eivätkä näy ulkopuolella. Tieteellisesti ilmaisten kyse on muuttujien näkyvyysalueesta.

Voidaan sanoa, että aaltosulkeiden sisällä määriteltyjen muuttujien näkyvyysalueena ovat vain nuo aaltosulkeet. Kuitenkin, jos muuttuja on määritelty aaltosulkeiden ulkopuolella, se on näkyvissä sekä niiden sisällä että ulkopuolella:

let res; // muuttuja määritelty ulkopuolella

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

console.log(res); // tulostaa '!'

Seuraavassa esimerkissä muuttujaan res ehdosta riippuen tallennetaan joko arvo 1 tai arvo 2:

let num = 5;

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

console.log(res);

Kuitenkin, jos suoritat tämän koodin, konsoliin tulostuu virhe. Kuten nyt jo ymmärrät, kyse on muuttujien näkyvyydestä. Ongelman ratkaisemiseksi määritellään muuttuja ehdon ulkopuolelle:

let test = true;
let res; // määritellään muuttuja ehdon ulkopuolelle

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

console.log(res); // tulostaa 1

Alla olevan koodin kirjoittaja halusi tarkistaa onko ikä vähintään 18 vuotta. Koodi ei kuitenkaan toimi. Korjaa koodin kirjoittajan virhe. Tässä on ongelmallinen koodi:

let age = 17;

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

console.log(adult);