javascript 변수 호이스팅

자바스크립트에서는 변수를 선언하는 방법은

 

크게 3가지로 나누어져 있는데

 

다음과 같다.

var a; // ~ ES5
console.log(a);

let b; // ES6 ~
console.log(b);

// const 키워드의 경우 선언과 동시에 초기화 해주어야한다.
const c = 10; // ES6 ~
console.log(c);

 

ES5 전부터 사용된 var의 경우는 조금 특별한 현상이있는데 일단은 현상부터 보면

console.log(sample); // undifined      
var sample = 10;

위와 같이 먼저 변수를 호출 하고 아래에서 선언 및 초기화 하여도 에러가 뜨는것이 아닌 undifined 대입되지 않았다고 나타난다는 것이다.

 

var sample = 10;

사실의 위의 구문은 두개의 구문이 합쳐진것인데 var 구문을 사용할경우 함수 선언문을 먼저 호출하고 이후에 변수에 값을 할당 해준다. 때문에 위와 같은 현상이 나타나고 이를 함수 호이스팅 이라고 한다.

var sample = 10;
// 선언문
// var sample;
// 초기화 및 대입
// sample = 10;

 

이런 현상은 ES6이후부터 추가된 let이라던가 const에서는 찾아보기 어렵지만 그래도 var 사용하는경우가 많으니 염두해두고 처리하는것이 좋을거같다.