호이스팅 (Hoisting)

호이스팅의 개념

함수 안에 있는 선언들을 모두 끌어올려 해당 함수 유효 범위의 최상단에 선언하는 것을 말한다.

자바스크립트 함수는 실행되기 전에 함수 안에 필요한 변수값들을 모두 모아서 유효 범위의 최상단에 선언한다. 여기서 유효범위는 함수 블록 {} 안이다. 실제로 코드가 끌어올려지는 건 아니며 자바스크립트 parser 내부적으로 끌어올려서 처리하는 것이다. 실제 메모리에서는 변화가 없다.

호이스팅의 대상

var변수 선언과 함수 선언문에서만 호이스팅이 일어난다. 할당은 끌어 올려지지 않고, let/const 변수 선언과 함수 표현식에서는 호이스팅이 발생하지 않는다.

호이스팅 예제

//1. ReferenceError는 발생하지 않으나 JavaScript는 호이스팅 된 변수를 undefined로 초기화
console.log(value); // undefined
var value = 'Hello'
console.log(value); // Hello

//2. 실제 인터프리터의 코드 해석
var value;
console.log(value); // undefined
value = 'Hello'
console.log(value); // Hello

// 결론은 JavaScript는 초기화가 아닌 선언만 호이스팅합니다.

참고 레퍼런스

블로그1
블로그2
poiemaweb
mdn