변수 호이스팅(variable hoisting)

console.log(test)

var test;

변수 선언문보다 변수를 참조하는 코드가 앞에 있다. 자바스크립트 코드는 인터프리터에 의해 한 줄씩 순차적으로 실행되므로 console.log(test)가 먼저 실행되고 순차적으로 다음 줄에 있는 코드를 실행한다.
따라서 console.log(test)가 실행되는 시점에는 아직 test 변수의 선언이 이루어지지 않았으므로 참조에러가 발생해야한다. 하지만 참조에러가 발생하지 않고 undefined가 출력된다.

그 이유는 변수 선언이 소스코드가 한 줄씩 순차적으로 실행되는 런타임 이전 단계에 실행되기 때문이다.

자바스크립트 엔진은 소스코드를 한 줄씩 순차적으로 실행하기에 앞서 소스코드의 평가과정을 거치면서 소스코드를 실행하기 위한 준비를 한다.

이때 자바스크립트 엔진은 변수 선언을 포함한 모든 선언문들을 찾아내 먼저 실행한다.
그리고 소스코드의 평가 과정이 끝나고 난 후 비로소 선언문들을 제외한 코드들을 순차적으로 실행시킨다.

즉, 자바스크립트 엔진은 변수 선언이 소스코드 어디에 있든 상관없이 다른 코드보다 먼저 실행한다. 따라서 변수 선언이 소스코드 어디에 위치하는지와는 상관없이 어디서든지 변수를 참조할 수 있다.

이처럼 변수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 자바스크립트 고유의 특징을 변수 호이스팅(variable hoisting)이라고 한다.

이 특징은 변수에만 해당되는 것은 아니며 모든 식별자(변수, 함수, 클래스 등)는 호이스팅 된다. 모든 선언문은 런타임 이전 단계에서 실행되기 때문이다.