# let, const 변수 호이스팅

● let 변수 호이스팅

console.log(foo) // ReferenceError: foo is not defined
let foo;

console.log(foo)  // undefined

foo = 1;
console.log(foo) // 1

let 변수는 var 변수와 같이 처음 코드라인이 undefined로 출력되지 않고 referenceError가 뜬다. 즉, 호이스팅이 되지 않는 것처럼 보이지만, 그게 아니라 let 변수는 선언단계와 초기화단계가 분리되어 작동한다.

 

즉, 스코프에 변수를 등록(선언단계)하지만 초기화 단계는 변수 선언문에 도달했을 때 이루어진다. 초기화 이전에 변수에 접근하려고 하면 참조 에러(ReferenceError)가 발생한다. 이는 변수가 초기화 되지 않았기 때문이다. 다시 말하면 변수를 위한 메모리 공간이 아직 확보되지 않았기 때문이다.  따라서 스코프의 시작 지점부터 초기화 시작 지점까지는 변수를 참조할 수 없다. 스코프의 시작 지점부터 초기화 시작 지점까지의 구간을 ‘일시적 사각지대(Temporal Dead Zone; TDZ)’라고 부른다.

let foo = 1; // 전역 변수

{
  console.log(foo); // ReferenceError: foo is not defined
  let foo = 2; // 지역 변수
}

결과값이 1이 나올것같지만, 호이스팅으로 인해 referenceError가 뜬다. let, const를 포함해서 (var, function, class등)모두 호이스팅을 하지만, 호이스팅이 작동되지 않는 것처럼 보인다.

 

● const 변수 호이스팅

const 같은 경우, 변수 선언과 동시에 초기화해야한다.

const foo;  // SyntaxError : Missing~~

// 선언과 동시에 할당
const foo = 1;

또한 호이스팅도 같이 이루어진다.

const foo = 2;
{
	console.log(foo);   // ReferenceError : Cannot access~~
    const foo = 3;
}