[Javascript] 호이스팅

호이스팅(hoisting)이란?

"변수의 선언과 초기화를 분리한 후, 선언만 코드의 최상단으로 옮기는 것"

호이스팅은 인터프리터가 변수와 함수의 메로리 공간을 선언 전에 미리 할당하는 것을 의미한다. var로 선언한 변수의 경우 호이스팅 시 undefined로 변수를 초기화한다. 반면 let과 const로 선언한 변수의 경우 호이스팅 시 변수를 초기화하지 않는다.

쉽게 말해, 변수를 정의하는 코드보다 사용하는 코드가 앞서 등장 할 수 있다. 다만 선언과 초기화를 함께 수행하는 경우, 선언 코드까지 실행해야 변수가 초기화된 상태가 됨을 주의해야 한다.

선언만 호이스팅 대상

Javascript는 초기화를 제외한 선언만 호이스팅한다. 변수를 먼저 사용하고 그 후에 선언 및 초기화가 나타나면, 사용하는 시점의 변수는 기본 초기화 상태(var 선언 시 undefined, 그 외에는 초기화하지 않음)를 가진다.

console.log(num);
var num; // 선언
num = 6; // 초기화

//위 코드에서 실행 결과는 호이스팅한 var 선언으로 인해 undefined이 출력된다.

선언 없이 초기화만 하는 경우, ReferneceError 예외가 발생한다!

console.log(num); 
num = 6; // 초기화

//위 코드에서는 선언 없이 초기화만 하였으므로 ReferenceError 예외 발생

console.log(num); 
var num = 6; 

// 위 처럼 작성하면 선언과 동시에 초기화를 하면서 호이스팅할 수 있다

let과 const 호이스팅

let과 const로 선언한 변수도 호이스팅 대상이지만, var와 달리 호이스팅 시 undefined로 변수를 초기화하지 않는다. 따라서 변수의 초기화를 수행하기 전에 읽는 코드가 먼저 나타나면 예외가 발생한다.

console.log(name);
const name = "현인";

// 위 처럼 const는 호이스팅 대상이지만 초기화 이전에 값에 접근이 되지 않는다. 
// 따라서 name을 찾을 수 없다는 예외가 발생한다.