[JavaScript] let, const 키워드와 블록 레벨 스코프

---

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

• 변수 중복 선언 허용 → 이미 선언되어 있는 변수의 값을 모르고 변경할 가능성 존재
• 함수 레벨 스코프: 함수의 코드 블록만을 지역 스코프로 인정  → 전역 변수가 중복 선언되는 경우 발생
• 변수 호이스팅 → 흐름이 맞지 않고, 가독성을 떨어트림

// 함수 레벨 스코프
var x = 1;

if (true) {
	// x는 전역변수 → 이미 선언된 전역 변수 x가 존재하므로 중복
    // 변수값이 변경됨
    x = 10;
}

console.log(x);  // 1이 아닌 변경된 값인 10이 출력

// 변수 호이스팅
console.log(name);  // 2. 변수 사용 → 변수가 undefined로 초기화  

name = 'KKK';  // 3. 변수 값 할당

console.log(name);  // 변수 사용 → 할당된 값 출력

var name;  // 1. 런타임 이전, JS 엔진에 의해 실행

 

---

02. let 키워드

• var의 단점을 보완하기 위해 ES6에서 도입됨
• 변수 중복 선언 금지 → 같은 변수를 사용할 경우 문법 에러 발생
• 블록 레벨 스코프: 모든 코드 블록을 지역 스코프로 인정
• 변수 호이스팅 → 변수 선언문 이전에 참조하여 사용할 경우 참조 에러 발생
  • 선언 단계와 초기화 단계가 분리되어 진행됨
  • 일시적 사각지대(Temporal DeadZone; TDZ): 스코프의 시작 지점부터 초기화 시작 지점까지 변수를 참조할 수 없는 구간
• var 키워드로 선언한 전역 변수,함수,객체들은 window의 프로퍼티(생략가능)이지만, let은 전역 객체의 프로퍼티가 아니므로 window로 접근할 수 없음

---

03. const 키워드

• 사용: 대체로 상수를 선언하기 위해(재할당이 금지인 것임, 불변은 아님)
• const의 특징은 let 키워드와 대부분 동일
• 특징 
  • 선언과 초기화: 반드시 선언과 동시에 초기화해야 함
  • 재할당 금지:
  • 상수: 재할당이 금지된 변수를 의미 → 상태 유지, 가독성, 유지 보수의 편의
• 상수는 대문자로 구성되며, 단어는 언더스코어(_)로 구분해서 스네이크 케이스로 표현하는 것이 일반적
•  const 키워드와 객체
  • const 키워드로 선언된 변수에 객체를 할당할 경우 값을 변경할 수 있음
  • 즉, 새로운 값을 부여하는 것은 불가능하지만, 프로퍼티 동적 생성, 삭제, 프로퍼티 값의 변경을 통해 객체를 변경하는 것은 가(참조 주소 값은 변하지 않음)

---

04. var vs let vs const

• 기본적인 변수 선언: const
• 재할당이 필요한 경우: let(변수의 스코프는 최대한 좁게 설정)
• ES6를 사용할 경우, var 사용 권장하지 않음
• 변경이 발생하지 않고 읽기 전용인 경우: const

---