Temporal Dead Zone 줄여서 TDZ !

 

우선 호이스팅을 알아보자

쉽게 말하면

스코프 내부 어디에서든 변수'선언'은 최상위에 선언된것처럼 행동하는것이다.

으로 정리 할 수 있고

 

MDN정의를 정리하면 아래와 같다.

인터프리터가 변수와 함수의 메모리공간을 선언전에 미리 할당하는 것을 의미한다.

즉 선언 전에 미리 할당하는것이다

그렇기 때문에 

let과 const도 호이스팅 된다는것이다 :)

 

 

그렇다면 var로 선언한 a는 undefined로 동작하는것은 알겠는데

console.log(a); //undefined

var a ;

let으로 선언한 b는 왜 ReferenceError가 발생하는 것일까?

너두 호이스팅 된다면서!

console.log(b); 
//ReferenceError: b is not defined
let b;

---

이유는 TDZ Temporal Dead Zone에 있었다!

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

 

TDZ를 이해하기전에 변수 생성의 3단계부터 알아보자

---

 

변수의 생성과정 3단계

1. 선언단계

2. 초기화 단계 // undefined

3. 할당 단계 // 값 할당

 

이렇게 3단계를 거쳐 변수가 생성이 된다.

 

2번 초기화 단계에서 undefined로 초기화된다.

3번에서 undefined로 초기화된 메모리에 값을 할당한다.

 

var ,let, const는 생성과정이 각자 다르다

---

var 의 변수 생성과정

1. 선언 + 초기화 단계

2. 할당 단계

let 의 변수 생성과정

1. 선언 단계

2. 초기화 단계

3. 할당 단계

const 의 변수 생성과정

1. 선언 + 초기화 + 할당 단계

---

이제 다시 TDZ로 돌아와서

 

var 로 선언했을때 아래의 코드를 다시 봤을때 

console.log(age); 
var age;

 

var로 선언된 변수의 생성과정을 보면

1. 선언 + 초기화

2. 할당

의 과정을 갖는다.

 

var age는 호이스팅되어 메모리에 할당됨과 동시에 초기화가 되어

undefined로 할당이 되어있기 때문에

undefined로 출력되는것이다.

 

console.log(age);
let age;

 

let 의 변수 생성과정을 다시 생각해보면

1. 선언

2. 초기화

3. 할당

과정을 갖는다.

 

let 으로 만든 age는 선언만 되어있고 => 호이스팅은 되어있는상태 (메모리에 할당)

console.log로 실행하려고 했을때 초기화가 되어있지 않기 때문에

ReferenceError가 발생하는 것이다.

즉 초기화 전에 접근을 했기 때문에 Reference Error가 발생한것이다.

 

이렇게 초기화전에 접근해Reference Error를 발생하는 구간

변수 선언 ~ 초기화 하기 전 사이를 TDZ상태라고 하는것이다.

---

코드 작성 순서가 아니라

코드의 실행 순서를 이해해야 하기 때문에

어려운 개념이었지만

재밌었당

 

끄읕

지적 환영~

하지만 부드럽게 말해야함ㅎ