Globální proměnné ve funkcích v JavaScriptu

V JavaScriptu (v jiných jazycích to většinou není tak) proměnné definované vně funkce budou viditelné uvnitř této funkce. Takové proměnné se nazývají globální. Podívejme se na příklad:

javascriptlet num = 1; // proměnná vně funkce

function func() {
  console.log(num); // proměnná num je viditelná uvnitř funkce
}

func(); // vypíše 1

Ve skutečnosti musí být proměnná definována ne před definicí funkce, ale před jejím voláním:

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

let num = 1; // proměnná vně funkce
func();      // vypíše 1

Pokud změníme hodnotu proměnné a poté pokaždé zavoláme funkci - console.log bude pokaždé vypisovat různé výsledky:

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

let num; // deklarujeme proměnnou

num = 1; // nastavíme hodnotu 1
func();  // vypíše 1

num = 2; // nastavíme hodnotu 2
func();  // vypíše 2

Pokud máme několik funkcí, pak globální proměnná bude dostupná v každé z těchto funkcí:

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

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

let num = 1;

func1(); // vypíše 1
func2(); // vypíše 1

Pokud v jedné z funkcí dojde ke změnám globální proměnné, pak se tato proměnná změní ve všech funkcích, které používají tuto proměnnou:

javascriptfunction func1() {
  console.log(num);
  num++; // měníme globální proměnnou
}

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

let num = 1;

func1(); // vypíše 1
func2(); // vypíše 2

Protože kterákoli z funkcí může snadno změnit globální proměnnou, jejich použití představuje semeniště obtížně zachytitelných chyb. Z tohoto důvodu by se mělo použití globálních proměnných ve skriptu minimalizovat. Je žádoucí, aby buď nebyly vůbec, nebo aby jich bylo co nejméně.

javascriptlet num = 1;
    
function func() {
  console.log(num);
}

func();

javascriptlet num = 1;
    
function func() {
  console.log(num);
}

num = 2;
func();

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

let num;

num = 1;
func();

num = 2;
func();