[JavaScript] 모던 JS Deep Dive 15장

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

• ES5까지 변수 선언은 var 키워드로 밖에 못했다

var 키워드의 특징

• 변수 중복 선언 허용
  • 초기화 문이 있는 중복 선언은 값의 재할당
  • 초기화 문이 없는 선언은 무시됨
• 함수 레벨 스코프
  • 오로지 함수의 코드 블록만을 지역 스코프로 인정함
  • 일반 코드 블록 내에서 선언해도 모두 전역 변수로 선언됨
  • 의도치 않은 전역 변수 사용 남발
• 변수 호이스팅
  • 변수 호이스팅(선언 단계+초기화 단계)에 의해 변수 선언문 이전에 참조 가능
  • 단 할당문 이전엔 undefined로 반환됨
  • 가독성 떨어지고 오류 발생시킬 여지 존재함

15.2 let 키워드

• var 키워드의 단점을 보완하기 위해 나온 새로운 변수 선언 키워드

let 키워드의 특징

• 변수 중복 선언 금지
  • let 키워드로 이름이 같은 변수 선언시 문법 에러 발생
• 블록 레벨 스코프
  • 모든 코드 블록을 지역 스코프로 인정함
• ⭐️변수 호이스팅
  • 변수 호이스팅이 발생하지 않는 것은 아님, 기존 방식과 다를 뿐.
  • let 키워드로 선언된 변수는 선언 단계와 초기화 단계가 분리되어 진행됨
  • 초기화 단계가 실행되기 전에 변수 참조시 참조 에러 발생
  • 일시적 사각지대: 스코프 시작 지점부터 초기화 단계 시작 지점까지 변수 참조 불가
• 전역 객체와 let
  • var 키워드로 선언한 전역 변수와 선언하지 않은 변수에 값을 할당한 암묵적 전역은 모두 전역 객체 window의 프로퍼티가 됨
  • 하지만 let 키워드로 선언한 전역 변수는 전역 객체의 프로퍼티가 아님

15.3 const 키워드

• 상수를 선언하기 위해 사용되지만 반드시 상수만을 위해 사용되지는 않음
• let 키워드와 거〰의 동일함

const 키워드의 특징

• 변수 선언시 반드시 선언과 초기화를 동시에 해야 함
  • 그렇지 않으면 문법 에러 발생
  • 변수 호이스팅이 존재는 하지만 let 키워드와 비슷하게 발생하지 않는 것처럼 동작함
  • 블록 레벨 스코프 가짐
• 재할당 금지
  • var let 키워드와 달리 const 키워드로 선언한 변수는 재할당 금지
• 상수
  • const 키워드로 선언한 변수에 원시 값을 할당한 경우 변수 값을 변경할 수 없음
  • 상태 유지와 가독성, 유지보수의 편의에 좋음
  • 일반적으로 상수의 이름은 SNAKE_CASE로 표현
• const 키워드와 객체
  • const 키워드로 선언된 변수에 객체를 할당한 경우 값을 변경 가능
  • const 키워드는 재할당을 금지할 뿐 ‘불변’을 의미하는 것은 아님
  • 하지만 변수에 할당된 참조값은 안변함

15.4 var vs. let vs. const

• 변수 선언에는 기본적으로 const 사용하면서 재할당이 필요한 경우에만 let 사용 추천

사용 권장 방법

• ES6를 사용하면 var 키워드 사용 비추
• 재할당이 필요한 경우에만 let 키워드 사용 추천, 대신 변수 스코프는 최대한 좁게
• 변경이 발생하지 않고 읽기 전용으로 사용하는 원시 값과 객체에는 const 키워드 사용 추천