2.1.1 const, let

보통 자바스크립트를 배울 때는 var로 변수를 선언하는 방법부터 배웁니다. 하지만 var은 이제 const와 let이 대체합니다. 먼저 const와 let이 공통적으로 갖는 특징인 블록 스코프(범위)에 대해 알아봅시다.

if (true) {
  var x = 3;
}
console.log(x); // 3

if (true) {
  const y = 3;
}
console.log(y); // Uncaught ReferenceError: y is not defined

코드는 크롬 개발자 도구(F12)의 Console 탭에 적으면 됩니다. Enter를 누르면 코드가 실행되는데, 코드를 실행하지 않고 줄바꿈을 하려면 Shift+Enter를 입력합니다.

x는 정상적으로 출력되는데 y는 에러가 발생합니다. var을 const로 바꿨을 뿐인데 차이가 발생하는 것입니다. var은 함수 스코프를 가지므로 if문의 블록과 관계없이 접근할 수 있습니다. 하지만 const와 let은 블록 스코프를 가지므로 블록 밖에서는 변수에 접근할 수 없습니다. 블록의 범위는 if, while, for, function 등에서 볼 수 있는 중괄호({와 } 사이)입니다. 함수 스코프 대신 블록 스코프를 사용함으로써 호이스팅 같은 문제도 해결되고 코드 관리도 수월해졌습니다.