[모던 자바스크립트 Deep Dive] let, const 키워드와 블록 레벨 스코프

var 키워드로 선언한 변수의 문제점

1. 변수 중복선언 허용

   var x = 1;
   var x = 100;
   
   console.log(x); // 100

2. 함수 레벨 스코프

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

3. 변수 호이스팅

   console.log(foo); // unndefined
   
   foo = 123;
   
   console.log(foo); // 123
   
   var foo;

const, let 키워드

1. 변수 중복 선언 금지

2. 블록 레벨 스코프

   let x = 1;
   
   if(true){
   	let x = 10;
   }
   
   console.log(x); // 1

3. 변수 호이스팅

   // 초기화 이전 일시적 사각지대에서는 변수를 참조할 수 없다.
   console.log(foo); // ReferenceError: foo is not defined
   
   let foo // 변수 선언문에서 초기화 단계 실행
   console.log(foo); // undefined
   
   foo = 123; // 할당 간계
   console.log(foo); // 123

   let 키워드로 선언한 변수는 ‘선언 단계’와 ‘초기화 단계’가 분리되어 진행된다.

   일시적 사각지대 : 스코프의 시작 지점부터 초기화 시작지점까지 변수를 참조할 수 없는 구간

전역객체와 let

let 키워드로 선언한 전역 변수는 전역 객체의 프로퍼티가 아니다!

let 전역 변수는 보이지 않는 개념적인 블록 내에 존재하게 된다.

let x = 1;

console.log(window.x); // undefined
console.log(x) // 1

var, let, const

• ES6를 사용한다면 var 키워드는 사용하지 않는다.

• 재할당이 필요한 경우에 한정해 let 키워드를 사용한다. 이때 변수의 스코프는 최대한 좁게 만든다.

• 변경이 발생하지 않고 읽기 전용으로 사용하는 원시 값과 객체에는 const 키워드를 사용한다. const 키워드는 재할당을 금지하므로 var, let 키워드보다 안전하다.