15. let, const 키워드와 블록 레벨 스코프

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

  1.1. 변수 중복 선언 허용

  - var키워드로 선언된 변수는 같은 스코프 내에서 중복선언을 허용한다.

  - 초기화문이 있는 변수 선언문은 자바스크립트 엔진에 의해 var키워드가 없는것처럼 동작한다.

 

  1.2. 함수 레벨 스코프

  - var키워드로 선언한 변수는 함수 코드 블록만을 지역 스코프로 인정한다.

 

  1.3. 변수 호이스팅

  - var로 변수를 선언하면 호이스팅이 일어나 변수 선언전에 참조하면 undefined를 반환한다.

 

2. let 키워드

  2.1. 변수 중복 선언 금지

  - let 키워드로 이름이 같은 변수를 선언하면 Syntax Error가 발생한다.

 

  2.2 블록 레벨 스코프

  - let으로 선언한 변수는 모든 코드 블록을 지역스코프로 인정하는 블록 레벨 스코프를 따른다.

 

  2.3 변수 호이스팅

  - let키워드로 선언한 변수는 변수 호이스팅이 발생하지 않는 것 처럼 동작한다 (실제로는 일어난다)

  - let키워드로 변수를 선언이전에 참조하면 ReferenceError가 발생한다.

  - var키워드로 선언한 변수는 선언과 동시에 undefinedfh 변수를 초기화한다.

  - 하지만 let 키워드는 선언단계와 초기화 단계를 분리해서 진행한다.

  - 런타임 이전에 엔진에 의해 암묵적으로 선언단계가 실행되지만 초기화 단계는 변수 선언문에 도달했을 때 실행된다.

  - 초기화 단계가 실행되기 이전에 변수에 접근하려고 하면 참조 에러가 발생한다.

  - 스코프의 시작 지점부터 초기화의 시작 지점까지 변수를 참조할 수 없는 구간을 일시적 사각지대(TDZ: Temporal Dead Zone)라고 부른다.

  

 

  2.4 전역 객체와 let

  - let키워드로 선언한 전역 변수는 전역 객체의 프로퍼티가 아니다. (var로 선언한 전역 변수,함수들은 window의 프로퍼티가 된다)

  - let 으로 선언한 전역 변수는 개념적 블록내에 존재하게 된다.

 

3. const 키워드

  3.1 선언과 초기화

  - const로 선언한 변수는 반드시 선언과 동시에 초기화 해야 한다.

  - const키워드는 let과 마찬가지로 블록 레벨 스코프를 가지며 변수 호이스팅이 발생하지 않는 것처럼 동작한다.

 

  3.2 재할당 금지

  - const 키워드는 재할당이 금지된다.

 

  3.3 상수

  - const키워드로 선언한 변수에 원시 값을 할당한 경우, 변수 값을 변경할 수 없다.

  - 원시 값은 변경 불가능한 값 이므로 재할당 없이 값을 변경할 수 있는 방법이 없기 때문이다.

  - 상수는 재할당이 금지된 변수를 의미한다.

  - 일반적으로 상수의 이름은 대문자로 선언해 상수임을 나타낸다.

  - 여러 단어로 이루어 질 경우 언더스코어로 구분해 스네이크 케이스로 표현한다.

 

  3.4 const 키워드와 객체

  - const로 선언된 변수에 객체를 할당한 경우 값을 변경할 수 있다.

  - const 는 재할당을 금지할 뿐 불변을 의미하지는 않는다.

 

4. var vs let vs const

  - 기본적으로 const를 사용하고 let은 재할당이 필요한 경우에 한정해 사용하는 것이 좋다.

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

  - 재할당이 필요한 경우에만 한정해 let을 사용하고, 변수의 스코프는 최대한 좁게 만든다.

  - 읽기 전용으로 사용하는 원시 값과 객체에는 const키워드를 사용한다.