처음부터 시작하는 javascript deep dive(15. let, const 키워드와 블록 레벨 스코프)

 

핵심 정리

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

 

앞에 스코프 장에서 잠깐 이야기 했지만 var 키워드로 선언한 변수의 문제점이 있습니다.

1. 변수 중복 선언이 가능합니다.

2. 오로지 함수의 코드 블록만을 지역 스코프로 인정합니다.

3. 변수 호이스팅

 

앞에서 살펴본 var 키워드의 단점을 보완하기 위해 ES6에서는 새로운 변수 선언 키워드인 let과 const를 도입했습니다.

 

let 키워드

1. 변수 중복 선언 금지

2. 블록 레벨 스코프

let foo = 1;
{
    let foo =2;
    let bar =3;
}

console.log(foo); // 1
console.log(bar); // ReferenceError: bar is not defined

3. 변수 호이스팅 : var 키워드로 선언한 변수와 달리 let 키워드로 선언한 변수는 변수 호이스팅이 발생하지 않는 것처럼 동작합니다.
let 키워드로 선언한 변수는 "선언 단계"와 "초기화 단계"가 분리되어 진행됩니다.

4. 전역 객체와 let : var 키워드로 선언한 변수와 전역 함수, 그리고 선언하지 않은 변수에 값을 할당한 암묵적 전역은 전역 객체 window의 프로퍼티가 됩니다. 전역 객체의 프로퍼티를 참조할 때 window를 생략할 수 있습니다.

var x = 1;
y = 2;

console.log(window.x); // 1
console.log(x);  // 1
console.log(window.y); // 2
console.log(y);  // 2

 

let 키워드로 선언한 전역 변수는 전역 객체의 프로퍼티가 아닙니다. 즉 window.x와 같이 접근할 수 없습니다.

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

 

const 키워드

1. const 키워드로 선언한 변수는 반드시 선언과 동시에 초기화해야 합니다.

const foo;
SyntaxError: Missing initializer in const declaration

 

2. 재할당 금지 : const 키워드로 선언한 변수는 재할당이 금지됩니다.

3. 상수 : 변수에 원시 값을 할당한 경우 변수 값을 변경할 수 없습니다. 변수의 상대 개념인 상수는 재할당이 금지된 변수를 말합니다.

4. const 키워드와 객체 : const 키워드로 선언된 변수에 객체를 할당한 경우 값을 변경할 수 있습니다. 변경 불가능한 값인 원시 값은 재할당 없이 변경할 수 있는 방법이 없지만 변경 가능한 값인 객체는 재할당 없이도 직접 변경이 가능합니다.