Tag Archives: WAT

Hoisting w JavaScript

Na początek zagadka: jakie komunikaty wyświetli poniższy kod?

Odpowiedź brzmi, oczywiście: undefined!

wat

W przeciwieństwie do jezyków takich jak C czy C#, nie każdy blok kodu definiuje zakres zmiennej, a jedynie funkcja. Nie ma przy tym znaczenia, w którym miejscu funkcji zmienną zadeklarujemy – będzie ona dostępna w całej funkcji, także przed deklaracją. Dlatego alert(x) nie zobaczy zmiennej globalnej, tylko lokalną. I zobaczy undefined dlatego, że co prawda zmienna jest już zdefiniowana, ale przypisanie do niej wartości ma miejsce później.

Powyższy kod będzie więc równoważny z takim:

A zatem – można powiezieć, że deklaracje zmiennych są jakby “wyciągane” (ang hoisted) na początek funkcji.

Ot, jedno z wielu dziwactw JavaScriptu.

Jaki z tego morał? Dobrą praktyką jest deklarowanie wszystkich zmiennych w jednej instrukcji var na samym początku funkcji. Taką też regułę posiada JSLint (i jego fork, JSHint), narzędzie sprawdzające styl kodu, którego używać powinien każdy programista JS.