Czym jest hositing w JavaScript?

Hoisting to zjawisko, które pojawia się w języku JavaScript i dotyczy sposobu, w jaki interpreter kodu JavaScript traktuje deklaracje zmiennych i funkcji. W skrócie, hoisting polega na przenoszeniu deklaracji zmiennych i funkcji na sam początek ich zakresu, niezależnie od tego, gdzie są one rzeczywiście zadeklarowane w kodzie.

Przykład hoistingu w JavaScript

Na przykład, jeśli mamy następujący kod:

console.log(x);
let x = 5;

To interpreter kodu JavaScript przeniesie deklarację zmiennej x na sam początek kodu, tak jakby była ona napisana tak:

let x;
console.log(x);
x = 5;

Jak widać powyżej, hoisting sprawia, że deklaracja zmiennej x jest przeniesiona na sam początek kodu, niezależnie od tego, gdzie jest ona rzeczywiście zadeklarowana.

Dzięki temu możemy używać zmiennej x w całym kodzie, nawet jeśli jej deklaracja znajduje się niżej w kodzie.

Hoisting działa tak samo dla funkcji. Jeśli mamy następujący kod:

console.log(add(2, 3));

function add(a, b) {
  return a + b;
}

To interpreter kodu JavaScript przeniesie deklarację funkcji add na sam początek kodu, tak jakby była ona napisana tak:

function add(a, b) {
  return a + b;
}

console.log(add(2, 3));

Jak widać powyżej, dzięki hoistingowi możemy używać funkcji add w całym kodzie, nawet jeśli jej deklaracja znajduje się niżej.