호이스팅(Hoisting)의 개념

*호이스팅이란?
컴파일 시점에서 변수, 함수의 선언부가 위치한 인접 스코프의 최상단으로 끌어올려지는 듯한 현상을 말한다.

JS는 코드를 실행하기 전에 컴파일 과정을 거친다. 컴파일은 고급 언어로 이루어진 코드를 저급 언어로 번역하여 컴퓨터가 이해할 수 있도록 분석하는 과정이다.

이 과정에서 JS 엔진은 모든 스코프를 탐색하며 각 실행 컨텍스트의 변수 객체에 여러 식별자를 수집한다. 결과적으로 코드 실행 시점 이전에 선언된 식별자에 대한 정보를 이미 알고 있기 때문에 호이스팅 현상이 발생하는 것이다.

하지만 호이스팅 현상이 모든 식별자에 동일하게 적용되진 않는다.

함수 호이스팅

호이스팅은 크게 함수 호이스팅과 변수 호이스팅으로 나뉜다. 그 중에서 함수 호이스팅은 다른 무엇보다 가장 먼저 이루어진다. 그리고 함수 호이스팅은 선언문에서만 이루어진다.

함수의 선언문은 식별자가 변수 객체에 수집될 때 부가적으로 해당 함수 참조에 대한 초기화까지 자동으로 이루어진다. 그래서 선언된 함수는 상단에서 참조, 호출이 가능하다.

변수는 3단계에 걸쳐 생성된다.

1단계: 선언 단계(Declaration phase)

2단계: 초기화 단계(Initialization phase)

3단계: 할당 단계(Assignment phase)

변수는 어떻게 선언했는지에 따라 선언, 초기화 시점이 달라질 수 있다.

var는 호이스팅이 발생하면 선언과 초기화가 거의 동시에 이루어진다. 실행 시점의 스코프 최상단에서 해당 변수에 대한 메모리가 살아있기 때문에 선언부 위치에 상관없이 참조, 할당이 가능하다.

let, const는 호이스팅이 발생하면 선언만 이루어지고 실행시점에서 실질적인 선언부를 만날 때까지 초기화는 이루어지지 않는다. 즉 변수에 대한 메모리가 존재하지 않기 때문에 선언부 상단에서 참조, 할당이 불가능하다.