Hoisting이란 ??
자바스크립트에서 변수, 함수를 선언한 위치보다 그 이전에서 참조 가능한것을 말한다.
hoisting을 알려면 실행 컨텍스트에 대해서 알아야 하는데 실행 컨텍스트에 대해서는 따로 글을 작성했으니 해당 글을 보고 오는 것을 추천한다.
실행 컨텍스트의 Variable Object 생성 및 초기화에서
개발자가 코드를 작성하면 변수나 함수는 실행 컨텍스트 내부에 Variable Objtect에 프로퍼티로 등록된다.
이 단계가 변수 선언 단계이다.
그리고는 메모리에 영역을 확보하고 undefined로 값을 할당한다.
이 단계가 변수 초기화 단계이다.
이후 마지막으로 개발자가 할당한 값을 넣는다.
이 단계가 변수 할당 단계이다.
var 키워드를 사용했을 때
런타임 실행 전 변수는 초기화 단계까지 실행되기 때문에 실제 값이 아닌 undefined가 출력되고 표현식 이전에도 참조가 가능한것이다.
let, const 키워드를 사용했을 때
런타임 실행 전 변수는 초기화 단계까지 가지 못하고 그 전 단계인 사각지대에 머무르게된다.
따라서 표현식 이전에 참조를 하게 되면 레퍼런스 에러가 출력된다.
그리고 런타임 실행시 초기화 단계와 할당 단계가 실행된다.
함수는 함수 선언식일 때
Variable Object의 프로퍼티로 함수명이 등록되고 함수 본체가 프로퍼티의 값으로 할당된다.
따라서 함수를 선언한 위치보다 이전에서 함수를 호출하게되면 error가 발생하지 않는다.
이를 함수 hoisting 이라고 한다.
함수 표현식일 때
변수에 함수를 할당하는 함수 표현식에는 Variable Object의 프로퍼티에 변수명이 등록되고 변수 hoisting 처럼 undefined가 프로퍼티의 값으로 등록된다.
이후 함수 본체가 프로퍼티의 값으로 할당된다.
따라서 함수 표현식은 변수 hoisting이 일어난다.
위에 작성한것처럼 Variable Object가 생성되고 초기화 되는 과정에서 변수명이나 함수명이 프로퍼티로 등록되기 때문에
hoisting이 가능한 것이다.