딥다이브 :: let, const

「딥다이브 자바스크립트」 정리 - let, const

※ 아래 내용은 책을 통해 학습한 것을 개인적으로 정리한 것으로 내용이 다소 부정확 할 수 있습니다.

 

---

 

함수란

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

1. 중복 선언 가능
   같은 스코프 내에서 중복하여 선언이 가능하다. 중복해서 선언한 변수는 var 키워드가 없는 것처럼 동작되어 재할당이 이루어질 뿐 에러는 발생하지 않는다.
2. 함수 레벨 스코프
   함수 외부에서 var 키워드로 선언한 변수는 모두 전역변수가 되어버린다. 예를 들어 if문이나 for문 내에서 선언한 변수도 모두 전역변수가 되어버리기에 전역 변수가 남발될 가능성이 높아진다.
3. 변수 호이스팅
   변수 호이스팅에 의해 변수 선언문이 스코프의 선두로 끌어올려지고, 그로 인해 변수 선언문 이전에 참조할 수 있게된다. 변수 선언문 이전에 변수를 참조하는 것은 호이스팅에 의해 에러가 나진 않지만 가독성을 떨어뜨리고 오류를 발생할 여지를 남긴다.
   
   

2. let 키워드

1. 변수 중복 선언 금지
   중복 선언 시 에러가 발생한다.
2. 블록 레벨 스코프
3. 변수 호이스팅
   var와 다르게 let은 변수 선언문 이전에 변수를 참조하면 참조 에러가 발생한다.
   var는 런타임 이전에 js 엔진에 의해 선언 단계와 초기화 단계가 한번에 이루어진다. 선언 단계에서 스코프에 변수 식별자를 등록시키고 초기화 단계에서 undefined로 초기화한다. 따라서 변수 선언문 이전에 접근해도 스코프에 변수가 있기에 에러가 발생하지 않는다.
   let은 선언단계와 초기화 단계가 분리되어 진행된다. 런타임 이전에 js 엔진에 의해 선언단계가 실행되고 초기화 단계는 변수 선언문이 도달했을 때 실행된다. 만약 초기화단계가 실행되기 이전에 변수에 접근하려하면 참조 에러가 발생하는 것이다. 이처럼 스코프의 시작 지점부터 변수 선언문까지 변수를 참조할 수 없는 구간을 일시적 사각지대(TDZ)라고 부른다.
   let은 얼핏보면 변수 호이스팅이 이루어지지 않은것처럼 보이는데, 변수 호이스팅은 모두 일어나고 있고 다만 그렇게 보이지 않을 뿐이다.
4. 전역 객체와 let
   var로 선언한 전역 변수는 전역 객체의 window 프로퍼티가 된다. 그러나 let으로 전역 변수를 선언하면 이는 전역 객체의 프로퍼티가 아니다. let 전역변수는 보이지 않는 개념적인 블록 내에 존재하게 된다.

3. const 키워드

const는 대부분의 특징이 let과 동일하다. 다만 몇 가지 다른 점이 있다

1. 선언과 초기화
   const는 반드시 선언과 초기화를 동시에 해야한다. 선언만 한다면 문법 에러가 발생한다.
2. 상수
   const는 재할당이 금지된 변수를 말한다. 원시값을 할당한 경우네는 값을 변경할 수 없다. 그러나 변경 가능한 값인 객체를 할당하는 경우에는 값을 변경할 수 있다. 객체는 재할당 없이도 직접 변경이 가능하기 때문이다. 즉, const는 재할당을 금지할 뿐 아예 변하지 않는다는 것은 아니다. 새로운 값을 재할당하는 것이 불가능할 뿐 프로퍼티의 동적 생성, 삭제, 변경을 통해 객체를 변경하는 것은 가능하다. 객체가 변경되더라도 변수에 할당된 참조 값이 변하는 것은 아니기 때문이다.
   일반적으로 상수의 이름은 대문자로 선언하여 상수임을 명확히 나타낸다. 여러단어로 이뤄진 경우에는 스네이크 케이스로 표현한다.