[JS] Hoisting(호이스팅)

Hoist - 끌어올리다

Hositing이란

코드를 실행하기전 자바스크립트 인터프리터가 변수, 함수, 클래스, import의 선언문을 끌어 올리는 것

hosting은 크게 4가지 type이 있다

1. Being able to use a variable's value in its scope before the line it is declared. ("Value hoisting")

2. Being able to reference a variable in its scope before the line it is declared, without throwing a ReferenceError, but the value is always undefined. ("Declaration hoisting")

3. The declaration of the variable causes behavior changes in its scope before the line in which it is declared.

4. The side effects of a declaration are produced before evaluating the rest of the code that contains it.

함수는 함수 선언 전에 호출이 가능하다 (type 1 - value hosting)

var 변수 호이스팅 (type 2)

let, const 변수와 클래스는 선언만 호이스팅되고 초기화는 안 된다 (type3) -> 아래 코드를 보면 블럭 스코프 안에 변수 선언이 호스팅 되고 값이 할당되지 않아서 에러가 발생하는 것을 확인할 수 있다

const x = 1;
{
  console.log(x); // ReferenceError
  const x = 2;
}

import (type1, type4)

참조

https://developer.mozilla.org/en-US/docs/Glossary/Hoisting