Ulkoisten muuttujien käyttö JavaScript-funktioissa

Tarkastellaan seuraavaa koodia:

javascriptlet num = 1; // asetetaan muuttujan arvo

function func() {
  console.log(num); // tulostetaan se konsoliin
}

func(); // kutsutaan funktiota

Kuten aiemmin mainitsin, muuttujan arvon ei välttämättä tarvitse olla ennen funktion määrittelyä, tärkeää on, että se on ennen sen kutsua:

javascriptfunction func() {
  console.log(num);
}

let num = 1;
func();

Oikeastaan tämä ei ole aivan totta. Funktiomme tietää muuttujan arvon jopa ennen sen kutsua num:

javascriptlet num = 1;

function func() {
  console.log(num); // funktio tietää jo, että num = 1
}

Tässä on monimutkaisempi esimerkki:

javascriptlet num = 1; // funktio saa tässä vaiheessa tietää, että num = 1

function func() {
  console.log(num);
}

num = 2; // funktio saa tässä vaiheessa tietää, että num = 2

Lisätään funktion kutsut:

javascriptlet num = 1; // funktio saa tässä vaiheessa tietää, että num = 1
func(); // tulostaa 1

function func() {
  console.log(num);
}

func(); // tulostaa 1
num = 2; // funktio saa tässä vaiheessa tietää, että num = 2
func(); // tulostaa 2

Toistan: funktio tietää ulkoisten muuttujien arvot, vaikkei sitä olisi koskaan kutsuttu.