자바스크립트에서 호이스팅이 가능한 이유는 자바스크립트 엔진이 코드를 실행하기까지 두 단계의 과정을 거치기 때문입니다.

이 두 단계는 컴파일 단계와 실행 단계이며, 이 과정에서 호이스팅이 발생하게 됩니다. 구체적으로 말씀드려보겠습니다.

첫번째로 컴파일 단계입니다.

자바스크립트 엔진은 스크립트를 실행하기 전에 먼저 컴파일 단계를 거칩니다. 이 과정에서 함수 및 변수 선언을 한 부분이 메모리에 할당됩니다. 이때 변수와 함수 선언을 미리 메모리에 올려두기 때문에 실제 코드에서 선언된 위치보다 앞에서 접근이 가능해지는 것입니다.

let, const가 아닌 var를 통해 선언되면, 컴파일 단계에서 변수가 메모리에 올라가며, 이때 값은 undefined로 초기화됩니다. 이후 실행 단계에서 코드가 진행되면서 실제 할당된 값이 대입됩니다.

console.log(myVar); // undefined
var myVar = 5;
console.log(myVar); // 5

위의 예시에서 myVar 변수 선언이 코드의 최상단으로 "호이스팅"되어 컴파일 단계에서 메모리에 먼저 올라가고, 초기값은 undefined로 설정됩니다.

따라서 console.log(myVar)의 첫 번째 출력에서 undefined가 나오는 것입니다.

두번째로 실행 단계입니다.

실행 단계란 실제 코드가 실행되는 과정으로, 컴파일 단계에서 메모리에 할당된 변수와 함수가 실행됩니다. 여기서 변수가 할당된 값을 가지게 되고, 함수가 호출되면 그 안의 코드가 수행됩니다.

정리해서 말씀 드리겠습니다. 자바스크립트에서 호이스팅이 가능한 이유는 자바스크립트 엔진이 코드를 단순히 한 줄씩 바로 해석하고 실행하지 않고, 먼저 컴파일 단계에서 코드를 파악하고 필요한 메모리를 확보하는 과정을 거치기 때문입니다.

이를 통해 코드 내에서 선언 위치와 상관없이 변수를 사용할 수 있는 유연성을 제공합니다.