❶ 변수, 호이스팅, TDZ(Temporal Dead Zone) | 자바스크립트 중급 문법

 

 

 

 

 

var & let

 

• var는 한번 선언된 변수를 다시 선언할 수 있다.

let name = 'hanseul';
console.log(name);

let name = 'duseul'
console.log(name);

//에러

 

• var는 선언하기 전에 사용할 수 있다.

console.log(name); // undefined
var name = 'hanseul';

 

왜 에러가 일어나지 않는가 ?

 

var name; //선언부
console.log(name); // undefined
name = 'hanseul'; //할당부

 

왜냐하면 var는 이렇게 동작하기 때문이다. 이를 호이스팅이라고 한다.

(호이스팅 : 스코프내부 어디서든 변수 선언은 최상위에 선언된 것처럼 행동)

 

반응형

 

그렇다면 왜 undefined를 반환할까?

 

선언은 호이스팅이 되지만 할당은 호이스팅되지 않기 때문이다.

 

즉, 'name'이라는 변수만 올라간 것이고 'hanseul'이라는 값은 올라가지 않는 것이다.

 

 

위와 같은 상황에서 let은 에러를 반환한다.

console.log(name); // 에러
let name = 'hanseul';

 

 

그렇다면 왜 var처럼 동작하지 않고 에러를 반환하는 걸까?

 

TDZ, Temporal Dead Zone 

• TDZ영역에 있는 변수들은 사용할 수 없다.
• let과 const는 이 TDZ의 영향을 받는다.
• 할당을 하기 전에는 사용할 수 없다. 

 

 

---

 

스코프

 

var: 함수 스코프 (함수 내에서 선언되면 함수 밖을 나갈 수 없음)

let, const: 블록 스코프 (중괄호{} 내에서만 사용가능)