hoisting

호이스팅(Hoisting)

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

일반적인 언어에서 위의 예제코드를 실행한다면 에러가 날것이다.

js에서는 특이하게도 선언전에 변수를 참조해도 에러가 아니다. (var한정)

ES6에서는 이런 문제를 해결하기위해 let 사용을 권장하고 있다.

console.log(b); // ref error - not defined
let b = 1;

오해

위의 설명에서 보는것과 같이 선언전에 참조할 수 있으므로

변수 선언이나 함수가 코드 상단으로 끌어올려지는 것처럼 보인다.

하지만 끌어올려지는게 아니다.

코드는 그 위치에 그대로 있다.

호이스팅

컴파일 단계에서 스코프가 생성되고 변수나 함수가 차지할 메모리를 즉시 할당한다.

이것이 호이스팅이다.

그래서 스코프내에서 선언 전에 참조할수있고, 선언이 끌어올려지는 것처럼 보인다.

그래서 위의 예제같은 코드가 있으면 변수선언의 경우 undefined가 뜨지만,

함수표현식이 아닌 함수선언식으로하면, 함수가 작동한다.

참고

함수표현식

const a = function() {
  //...some code
}

함수 선언식

function a() {
  //...some code
}