변수, 함수 선언식, 함수 표현식 호이스팅 여부

 

 

변수/함수 유형	호이스팅	초기화	특징
var 변수	일어남	undefined	함수 스코프, 선언 전 사용 시 undefined
let 변수	일어남	초기화 안됨 (TDZ)	블록 스코프, 선언 전 사용 시 ReferenceError
const 변수	일어남	초기화 안됨 (TDZ)	블록 스코프, 선언 전 사용 시 ReferenceError, 재할당 불가
함수 선언식 (Function Declaration)	일어남	함수 전체 로드	선언 전 호출 가능
함수 표현식 (Function Expression, var)	일어남	undefined	선언 전 호출 시 TypeError 발생 가능
함수 표현식 (Function Expression, let, const)	변수 호이스팅 규칙을 따름	초기화 안됨 (TDZ)	선언 전 호출 시 ReferenceError 발생

 

 

일반적으로 모든 변수는 호이스팅이 된다. 때문에 참조 자체는 가능하다.

하지만 var를 제외한 변수 let, const는 값을 할당하기 전에 사용하면 오류가 나게 된다.

물론 var도 undefined로 값이 채워져 있기 때문에 오류만 나지 않는 것이지 정상적으로 작동하진 않는다.

 

함수 선언식의 경우 함수 자체가 통째로 호이스팅 되어 언제든 사용이 가능하지만

함수 표현식은 변수만이 호이스팅된다. 즉 표현식을 선언한 변수만 호이스팅되는 것인데 호출 자체는 가능하지만 오류가 난다.

함수 표현식은 해당 표현식이 있는 코드가 실행된 이후에만 호출이 가능해진다.

// 함수 표현식 (선언 전에 호출하면 에러 발생)
myFunction(); // ReferenceError: Cannot access 'myFunction' before initialization

const myFunction = function() {
  console.log('Hello, world!');
};

// 함수 표현식 (선언 후에 호출 가능)
myFunction(); // Hello, world!