Kwalifikacja: INF.04 - Projektowanie, programowanie i testowanie aplikacji
Zawód: Technik programista
Jaki będzie wynik działania poniższego kodu JavaScript?
function foo() { console.log(a); var a = 1; console.log(a); } foo(); |
Odpowiedzi
Informacja zwrotna
Wynik działania podanego kodu to 'undefined, 1', co jest zgodne z zasadami hoisting w JavaScript. Kiedy funkcja 'foo' jest wywoływana, zmienna 'a' jest zadeklarowana przy użyciu 'var'. Zgodnie z zasadą hoisting, deklaracja zmiennej jest przenoszona na początek funkcji, ale przypisanie wartości następuje w miejscu, gdzie znajduje się kod. Dlatego, podczas pierwszego wywołania 'console.log(a)', 'a' nie ma jeszcze przypisanej wartości, co skutkuje wyświetleniem 'undefined'. Następnie, po przypisaniu '1' do 'a', w drugim 'console.log(a)' zmienna ta już ma wartość, więc wyświetlane jest '1'. Zrozumienie hoisting jest kluczowe dla programistów, ponieważ może wpływać na logikę działania kodu i prowadzić do błędów, jeśli nie jest odpowiednio uwzględnione. W praktyce powinno się unikać korzystania z hoisting, preferując inicjalizację zmiennych na początku funkcji, co zwiększa czytelność i utrzymanie kodu.
Wynikiem działania tego kodu nie może być 'ReferenceError, 1', ponieważ w sytuacji, gdy zmienna 'a' została zadeklarowana za pomocą 'var', nie może wystąpić błąd referencyjny związany z odwołaniem się do niej przed jej przypisaniem. Wartość zmiennej 'a' przed jej przypisaniem to 'undefined', a nie 'ReferenceError', co jest typowym nieporozumieniem w kontekście hoisting. W przypadku zmiennych zadeklarowanych za pomocą 'let' lub 'const', rzeczywiście moglibyśmy napotkać 'ReferenceError', gdyż te zmienne mają tzw. „temporal dead zone” przed ich zadeklarowaniem. Wynik 'undefined, undefined' również nie jest poprawny, ponieważ po pierwszym 'console.log' zmienna 'a' jest jeszcze niezainicjalizowana i wyświetli 'undefined', ale drugie 'console.log' z pewnością wyświetli wartość '1', po przypisaniu. Odpowiedź '1, 1' jest również błędna, ponieważ pierwsze logowanie 'a' przed przypisaniem z pewnością da 'undefined'. Ważne jest zrozumienie zasad hoisting oraz jak różne typy deklaracji zmiennych wpływają na ich zakres i inicjalizację, aby unikać nieporozumień w przyszłości.