[JavaScript] var 대신 let/const를 사용하자(ES6)

예전에 노마드코더 강의에서, var 쓰지말라고 했다. 쉽게 얘기하자면 var은 목적이 불분명해서 훨씬 명확하게 읽을 수 있는 let/const 로 분류하자는 말이었다.

→ let는 재할당이 필요한 경우

→ const는 재할당이 필요없는 경우

나는 명백히 var에 단점이 있다고 생각한다. 모던 자바스크립트 Deep Dive 15장을 읽으며 몰랐던 개념에 대해 정리하겠다.

• 일시적 사각지대(Temporal Dead Zone, TDZ)

스코피의 시작 지점부터 초기화 시작 지점까지 변수를 참조할 수 없는 구간이다. 나는 var가 맨 끝에 갖다놔도 hoisting이 되므로 let도 동일하게 동작할 것이라 생각했다. 그러나! var은 선언 단계와 초기화 단계가 한번에 진행된다. 하지만 let로 선언하면 두 단계가 분리된다.

• const 키워드로 선언된 변수에 객체를 할당한다면?

const fruit = {
	name : 'pear'
};

fruit.age = '11';

console.log(fruit) //{name: 'pear', age: '11'}

const로 값을 선언하면 ‘불변한다’ 라고 얼핏 생각할 수 있다. 그러나 변수에 객체를 할당한다면 값을 변경할 수 있다. 이는 primitive type/object 두 가지의 차이를 비교하면 알 수 있다. 객체가 변경되더라도 변수에 할당된 참조값은 변경되지 않는다! 단지 const는 재할당을 금지할 뿐이다.

의문 해결 → react를 쓰면서 함수나 객체를 선언할 때 const를 사용하는게 묘하게 고민됐다. 이런 이유에서 자유롭게 사용이 가능하다는 걸 알았다.