개발일지

3월 기술면접대비 - 일시적 사각지대( TDZ : Temporal Dead Zone ) 본문

frontEnd/기술면접

3월 기술면접대비 - 일시적 사각지대( TDZ : Temporal Dead Zone )

푸린푸린김푸린 2024. 3. 7. 00:23

 

 

 

먼저 읽으면 좋을 글 ! 

var, let, const - https://puringles.tistory.com/743

호이스팅 ( hoisting ) - https://puringles.tistory.com/744

 

 

TDZ란?

일시적 사각지대

스코프의 시작 지점부터 초기화 시작 지점까지의 구간을 말합니다.

 

JavaScript에서 변수는 선언, 초기화, 할당이라는 3가지의 단계에 걸쳐 생성됩니다.

변수 라이프사이클

 

 

  • 선언 단계(Declaration phase) : 변수를 실행 컨텍스트의 변수 객체에 등록하는 단계를 의미합니다. 이 변수 객체는 스코프가 참조하는 대상이 됩니다.

 

  • 초기화 단계(Initialization phase) : 실행 컨텍스트에 존재 하는 변수 객체에 선언 단계의 변수를 위한 메모리를 만드는 단계 입니다. 이 단계에서 할당된 메모리에는 undefined로 초기화 됩니다.

 

  • 할당 단계(Assignment phase) : 사용자가 undefined로 초기화된 메모리의 다른 값을 할당하는 단계 입니다. 



 

여기서 var와 let,const 가 왜 호이스팅이 일어나는 모습이 서로 다른지 알게 됩니다.

 

var 키워드 변수는 변수 선언전에 선언 단계와 초기화 단계를 동시에 진행합니다.
그래서 JavaScript는 실행 컨텍스트 변수 객체의 변수를 등록하고 메모리를 undefined로 만들어 버립니다.

그렇기 때문에 변수를 선언하기 전에 호출하면 undefined로 호출이 됩니다.

 

let,const 키워드로 선언된 변수는 var 키워드와는 다르게 선언단계와 초기화 단계가 분리되어서 진행이 됩니다.

그렇기 때문에 실행 컨텍스트에 변수를 등록했지만, 메모리가 할당이 되질 않아 접근할 수 없어 참조 에러(ReferenceError)가 발생하는 것입니다.

바로 이 부분 ( 스코프 최상단에서부터 초기화 시작 부분 ( 코드에서 let 선언문이 적힌 부분 ))까지의 부분을 TDZ이라고 합니다.

이것을 보고 우리는 let과 const는 호이스팅이 되지 않는다고 오해할 수도 있습니다.

하지만 JS의 모든 선언에는 호이스팅이 일어납니다.

 

 

 

 

 

 

 

 

 

 

 

 

reference.

TDZ(Temporal Dead Zone)이란?.우주개발자 블로그.(20.07).https://noogoonaa.tistory.com/78

 

 

 

 

 

 

Comments