Javascript 호이스팅(Hoist)

https://www.emanueleferonato.com/2020/11/13/understanding-javascript-hoisting/

- 뭔가를 끌어올린다 라고 생각하면 됩니다.

- JS 에서 호이스팅은 코드가 실행되기 전에 변수, 함수 선언 이 지역범위(로컬 범위) 의 맨 위로 끌어 올려지는 경우입니다.

 

1. var 

 

- 많이 이상해보이지만 호이스팅 때문에 오류가 나지 않습니다.

- JS 인터프리터는 변수 생성과 할당값을 분할합니다. 선언부분은 코드 실행 전 범위의 맨 위로 호이스팅 초기 값은 undefined 가 할당됩니다.

console.log(hoisting);

var hoisting = "hi hoisting";
console.log(hoisting);

/* === 실행 결과 ===
undefined
hi hoisting
*/

---

2. 함수 호이스팅

 

- 함수도 바로출력

hoistingFunc();

function hoistingFunc() {
  console.log("Function Hoisting");
}

/* === 실행 결과 ===
Function Hoisting
*/

---

3. let , const 호이스팅

 

- 변수를 선언하면 여전히 호이스팅 되지만 var는 undefined 라는 값이 할당되지만 let, const 는 어떤 값도 할당되지 않는다.

- 변수를 사용할 수 없는 비활성 상태이기 때문에 에러가 발생한다.

console.log(constHoisting);

const constHoisting = "oh failed";

/* === 실행 결과 ===
caught ReferenceError: Cannot access 'constHoisting' before initialization
*/