var name = 'sora';
console.log(name);
//sora

당연히 sora가 출력된다

그렇다면… 이렇게 순서를 바꾸면?!

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

undefined가 출력된다.

``

위에서 아래로 코드가 실행되는 자바스크립트의 특성을 고려해본다면

상식적으로 변수가 선언되지 않았기 때문에 당연히 에러를 뿜어야하지만

에러가 아니고 그냥 언디파인을 되돌려준다

이유는?

호이스팅되기 때문!

호이스팅이 뭐냐면,

출처 https://www.ergonomicpartners.com/store/2-ton-harrington-ner-electric-chain-hoist

이런거임ㅋㅋㅋ 위로 올리는 거

.

이 말은,

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

이것과 똑같다는 거다.

var로 선언된 변수가 가장 최상위로 위로 보내지는것

그러니 에러가 아니라 언디파인을 되돌려주는 것이다

그치만 이건 문제가 있다.

개발자가 바보같은 코드를 썼을때 ‘에러발생🚨 ‘이라고 미리 알려주어야하는데

그냥 넘어가버린다는 것!

버뜨, 여기서 var 대신에 let 을 사용하게 되면 에러를 뿜어준다

고로 let을 쓰라 이마뤼야~~~~~

let을 쓰게 되면 탑으로 올라가지 않는다(호이스팅 되지 않음)

*하지만 정확하게 말하자면 호이스팅되지 않는게 아니라 선언되기 전까지 호이스팅되지 않는다는게 정확할듯

*강의에서는 간단하게 하기 위해서 생략한듯 싶다

TDZ은 변수가 닿을 수 없는 곳에 위치한 상태이다. 스코프 안에 존재하지만 선언되지는 않는 것들

let과 const변수는 TDZ안에 그들이 선언될때까지 스코프안에 존재한다.

https://www.freecodecamp.org/news/what-is-the-temporal-dead-zone/에서 정리를 잘 해주었는데

헷갈린다면,

변수가 호이스팅될때 var 는 호이스팅과정에서 값들을 디폴트로 초기화시켜버린다(그러므로 undefined뜸)

그치만 let 과 const 는 호이스팅 되긴하지만 undefined으로 자동 설정되지는 않는다는 것이다!

``

https://www.freecodecamp.org/news/what-is-the-temporal-dead-zone/ 와

노마드코더의 ‘ES6의 정석’을 듣고 정리 =)