⬇️ MDN 호이스팅
var num; // 선언
num = 6; // 초기화
// 예제 1
console.log(num) // var 호이스팅, undefined 출력
var num; // 선언
num = 6; // 초기화
// 예제2
console.log(num); // ReferenceError
num = 6; // 초기화
// 예제 3
// y만 호이스팅 대상, 초기화된 값2는 호이스팅되지 않음
x = 1; // x 초기화. x를 선언하지 않은 경우 선언. 그러나 명령문에 var가 없으므로 호이스팅이 발생하지 않음
console.log(x + " " + y); // '1 undefined'
// JavaScript는 선언만 호이스팅하므로, 윗줄의 y는 undefined
var y = 2; // y를 선언하고 초기화
// 예제 4
// 호이스팅은 없지만, 변수 초기화는 (아직 하지 않은 경우) 변수 선언까지 병행하므로 변수를 사용할 수 있음
a = '크랜'; // a 초기화
b = '베리'; // b 초기화
console.log(a + "" + b); // '크랜베리'⬇️ ★ TDZ
let, const 키워드로 선언한 리터럴 값은 호이스팅은 되나 특별한 이유로 인해 “초기화가 필요한 상태”로 관리되고 있다.
console.log(name); // undefined
var name = 'Evan';
console.log(aaa) // Uncaught ReferenceError: aaa is not defined
console.log(name); // Uncaught ReferenceError: Cannot access 'name' before initialization
let name = 'Evan';선언 (Declaration): 스코프와 변수 객체가 생성되고 스코프가 변수 객체를 참조한다.
초기화(Initalization): 변수 객체가 가질 값을 위해 메모리에 공간을 할당한다. 이때 초기화되는 값은 undefined이다.
할당(Assignment): 변수 객체에 값을 할당한다.
var 키워드를 사용하여 선언한 객체의 경우 선언과 초기화가 동시에 이루어진다. 선언이 되자마자 undefined로 값이 초기화 된다는 것이다.
let 키워드나 const 키워드로 생성된 변수들이 TDZ(Temporal Dead Zone) 구간에 들어가는데 TDZ 구간에 있는 변수 객체는 선언은 돼있지만 초기화가 되지 않아 변수에 담길 값을 위한 공간 메모리에 할당이 되지 않게됨. 해당 변수에 접근을 시도하면 "Cannot access '%' before initialization" 에러 메시지 출력.
TDZ의 보호를 받고 있지 않은 키워드인 var를 사용하는것은 변수의 값이 언제 바뀔지도 모르며 스파게티 코드를 만드는 주범이 될 수 있으므로 절대로 지양해야 합니다 😉
a