호이스팅

🛠 정의

JavaScript에서 호이스팅(hoisting)이란, 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미합니다.

⏰ 규칙

• 선언된 함수는 상단에서 호출 및 참조가 가능
• 선언된 var는 상단에서 할당 및 참조가 가능
• 선언된 let, const는 할당 및 참조가 불가능

함수 호이스팅

함수 호이스팅은 선언문에서만 발생한다. 그러므로 상단에서 호출 및 참조가 가능하다.
그러나 함수 표현식은 변수에 할당하는 형태이기 때문에 변수 호이스팅의 사례로 분류할 수 있다.

example1(); // 함수 선언문에서는 호이스팅 일어난다.
example2(); // 함수 표현식이라서 호이스팅 안된다.

function example1() {
  console.log('Hello');
}

var example2 = function() {
  console.log('world');
}

변수 호이스팅

변수의 생성단계

• 선언 단계 : 변수 객체를 실행 컨텍스트에 등록한다.
• 초기화 단계: 등록된 변수의 메모리를 확보한다. 이 단계에서 변수는 undefined로 초기화된다.
• 할당 단계: 초기화된 변수에 실제 값을 할당한다.

var : 호이스팅이 발생하면, 선언과 초기화가 거의 동시에 이루어진다.
실행 시점의 스코프 최상단에서 해당 변수에 대한 메모리가 살아있기 때문에 선언부 위치에 상관없이 참조, 할당이 가능하다.
let , const : 호이스팅이 발생하면, 선언과 초기화가 동시에 이루어지지 않는다. 실행 시점에서 실질적인 선언부를 만날 때 비로소 초기화가 이루어진다.
그리므로 해당 변수에 대한 메모리는 존재하지 않기 때문에 선언부 상단에서 참조, 할당이 불가능하다.

출처
https://developer.mozilla.org/ko/docs/Glossary/Hoisting