자바스크립트 핵심 복습: 변수

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

var name = 'Mike';
var name = 'Jane';	// 가능

var는 선언하기 전에 사용할 수 있다. (hoisting)

console.log(name)	// undefined
var name = 'Mike';	// 할당은 여기에서 되고 선언만 hoisting된다.

사실 let과 const도 호이스팅되는데 에러가 발생한다. 왜그럴까?

• var는 선언과 초기화를 동시에 진행하여서 TDZ가 존재하지 않는다.
  

• let은 선언과 초기화가 분리되어 그 사이에 TDZ가 생성되고, const는 선언과 초기화가 동시에 진행되지만 선언 이전에 TDZ가 생성되어 접근하면 ReferenceError가 발생한다.
  

Temporal Dead Zone (사각지대) 란?
TDZ(Temporal Dead Zone)은 컴퓨터가 값으로 완전히 초기화하는 순간까지 변수에 엑세스할 수 없는 블록 영역이다.
초기화가 완료되기 전에 변수에 엑세스하려고 한다고 가정한다. 이러한 경우 JavaScript는 ReferenceError가 발생한다.
따라서 JavaScript에서 이러한 오류가 발생하지 않도록 하려면 TDZ외부에서 변수에 접근해야 한다는 것을 명심해야 한다.
그렇다면 TDZ의 시작과 끝은 정확히 어디일까?

TDZ의 범위

let age = 30;
function showAge(){
	console.log(age);
}
showAge();

위 코드는 문제가 없다.

let age = 30;
function showAge(){
	console.log(age);
    let age = 20;	// hoisting은 되나, error발생
    				// hoisting이 되지 않았다면 30이 찍혔을 것
}
showAge();

위 코드는 에러가 발생한다.

스코프

• var : 함수 스코프

const age = 30;
if(age>19){
	var txt = '성인';	// let, const는 이 블록 내에서만 존재 가능하다.
}
console.log(txt);	// '성인'

function add(num1, num2) {
	var result = num1 + num2;
}
add(2,3);
console.log(result);	// error!

• let, const : 블록 스코프

var보다는 예측가능하고, 버그를 줄일 수 있는 let, const사용이 권장된다.