Hoisting이란 무엇인가?

Hoisting이란 변수 선언이나 함수 선언이 코드의 최상단으로 끌어올라가는 현상을 말한다.

자바스크립트 엔진은 실행하기 전에 코드를 스캔하면서 변수 선언과 함수 선언을 메모리에 저장하기 때문에 이런 현상이 발생한다.

 

• 값 할당(초기화)나 함수 표현식의 경우은 끌어올리지 않으며, 모두 해당 위치에서 실행된다.
• var는 선언만 호이스팅되고, 초기화는 실제 코드 실행 시에 이루어진다. 그래서 console.log(a)는 undefined를 출력하지만, 에러는 발생하지 않는다.
• let과 const는 선언은 끌어올려지지만 초기화되기 전까지는 접근할 수 없는 상태가 된다. 이 구간을 일시적 사각지대(TDZ)라고 부른다.

 

예: 값 할당(초기화) 

console.log(a); // undefined
var a = 10;

 

예: 함수 표현식

example(); // Cannot access 'example' before initialization
const example = () => {
  console.log("Hi");
};

 

예: 함수 선언식

example(); // "Hello" (함수 선언은 호이스팅되어 호출 가능)
function example() {
  console.log("Hello");
}