[JS] 호이스팅, let과 var의 차이

• hoisting을 설명:
  • 코드를 실행하기 전에 변수, 함수, 클래스의 선언문을 미리 끌어 올리는 것
  • 변수와 클래스의 경우, 선언만 호이스팅 되고, 초기화는 되지 않음

console.log(a); // undefined
a = 1
var a = 1;
console.log(a); // 1

• let & var의 차이점을 설명
  • var는 전역/지역 변수의 구분이 없음
  • 그러나, 함수에서는 hoisting되어 지역변수로 사용이 가능
  • 똑같은 변수명으로 재선언이 가능

// 함수에서 var는 지역변수로 기능
function foo() {
	var b = 1;
}
console.log(b); // *b is undefined*

// 조건문에서 var는 전역변수로 기능
for(var i = 1; i<5; i++){
	console.log(i);
}
console.log(i); // *12345

// 같은 변수명으로 재선언 할 수 있음
var a = 1;
console.log(a); // 1
var a = 2;
console.log(a); // 2*

• let & var의 차이점을 설명
  • let은 모든 코드 블럭에서 전역/지역 변수를 구분함
  • let은 호이스팅을 하지만, Temporary Death Zone(TDZ)을 만들어서 a의 선언문이 나오기 전까지는 값을 불러올 수 없음
  • 똑같은 변수명으로 재선언이 불가능

// 조건문에서 var는 전역변수로 기능
for(let i = 1; i<5; i++){
	console.log(i);
}
console.log(i); // *i is not defined

// 같은 변수명으로 재선언 할 수 있음
console.log(a); // Cannot access 'a' before initialization
let a = 1;
console.log(a); 
let a = 2; // Identifier 'a' has already been declared*