[ES6] var와 let & const

다음과 같은 코드가 있다.

function getClothing(isCold) {

if (isCold) {

var freezing = "Grab a jacket!";

} else {

var hot = "It's a shorts kind of day";

console.log(freezing);

}

}

이 함수를 호출하면 어떻게 될까?

else 블록 안에 freezing이 없기 때문에 Referrence error가 날 것 같지만, Hoisting으로 인해 예상 밖의 결과가 발생하는데, undefined가 출력된다.

run-time에서, hoisting이 일어난 코드는 다음과 같이 생겼을 것이다.

function getClothing(isCold) {

var freezing, hot;

if (isCold) {

freezing = "Grab a jacket!";

} else {

hot = "It's a shorts kind of day";

console.log(freezing);

}

}

(실제로 코드가 이렇게 바뀐다는 게 아니라, 위와 같은 로직으로 작동한다는 뜻이다)

즉 freezing이 선언은 되어 있지만, else 블록으로 가게 될 경우에는 아무 값이 할당되지 않으므로 undefined가 출력되는 것이다.

이러한 hoisting이 일어나지 않게끔 하는 방법이 ES6에서 추가됐는데, let과 const다. let과 const는 한마디로, block scoped다. 그 블록 안에만 있고, 어디로 이동하는 일이 없다. 즉 hoisting이 일어나지 않는다.

function getClothing(isCold) {

if (isCold) {

const freezing = "Grab a jacket!";

} else {

const hot = "It's a shorts kind of day";

console.log(freezing);

}

}

const로 변수를 선언했다. 출력하면, 당연히 Referrence error가 발생한다. 선언된 블록 안에만 있으니까 그렇다. 

위에서 var로 변수를 선언했을 때는 undefined(즉 변수가 선언되어 있기는 하지만 정의되지 않았다는 뜻), 이번에 const로 변수를 선언했을 때는 Referrence error가 발생했다(freezing이라는 변수를 찾을 수 없다는 뜻)는 점에 주목하자.

그렇다면 let과 const의 차이는? 어떤 값을 이후에 다시 할당할 계획이라면 let, 한번 할당 후 바꾸지 않을 계획이라면 const를 쓴다.

그럼 var는 이제 쓸모 없는 것일까? Udacity의 ES6 course에서는,

Is there any reason to use var anymore? Not really. 라고 말하고 있다. 

전역 변수로 활용하고자 할 때 var를 쓸 수는 있겠지만, 이는 나쁜 습관이니 결론은 let과 const만 쓰라는 것이다.

---

※ 참고: temporal dead zone이란?