Hoisting이란?

Hoisting(호이스팅)은 JavaScript에서 변수 및 함수 선언이 소스코드 상단으로 끌어올려지는 동작을 의미합니다. 이는 코드가 실행되기 전에 JavaScript 엔진에 의해 처리되는 메커니즘입니다

간단하게 말하면 JavaScript 엔진은 코드 실행 전에 변수 및 함수 선언을 해당 스코프의 최상단으로 끌어올립니다. 이 과정에서 변수는 해당 스코프의 시작 부분으로, 함수는 함수 전체가 끌어올려지며, 실제 코드의 위치와는 상관없이 선언부만을 끌어올립니다.

console.log(myVar); // undefined
var myVar = 10;
console.log(myVar); // 10

// 위의 코드는 아래와 같이 동작합니다.
var myVar; // 변수 선언이 호이스팅되어 맨 위로 올라갑니다.
console.log(myVar); // undefined
myVar = 10;
console.log(myVar); // 10

함수 또한 호이스팅됩니다. 함수 선언은 해당 스코프의 맨 위로 끌어올려지므로 함수를 선언하기 전에 호출할 수 있습니다.

myFunction(); // "Hello, world!"

function myFunction() {
  console.log("Hello, world!");
}

위의 코드에서 myFunction 함수는 실제 선언보다 먼저 호출되었지만, 함수 선언이 호이스팅되어 함수가 호출될 수 있게 됩니다.