13_Javascript의 호이스팅에 대해 설명해주세요.

✅ 호이스팅(Hoisting)은 JavaScript에서 변수 및 함수 선언이 소스 코드의 맨 위로 끌어올려지는 것을 의미합니다. 이는 실제로 코드의 위치와 상관 없이 변수 및 함수 선언이 컨텍스트(함수 스코프 or 전역 스코프)의 맨 위로 옮겨지는 것을 의미합니다.

✅ 변수 호이스팅:
JavaScript에서는 변수 선언이 선언되기 전에도 사용할 수 있습니다. 이는 변수가 해당 스코프의 맨 위로 끌어올려진 후에 선언된 것처럼 동작합니다.

console.log(x); // undefined
var x = 5;

 

위의 코드에서 x 변수는 선언되기 전에 console.log()에서 사용되었지만, 오류가 발생하지 않고 undefined를 출력합니다. 이는 변수 선언이 호이스팅되어 해당 스코프의 맨 위로 끌어올려졌기 때문입니다.

✅ 함수 호이스팅:
함수 선언도 변수 선언과 유사하게 호이스팅됩니다.

foo(); // "Hello, World!"

function foo() {
  console.log("Hello, World!");
}

 

위의 코드에서 foo() 함수는 선언되기 전에 호출되었지만, 오류가 발생하지 않고 정상적으로 실행됩니다. 이는 함수 선언이 호이스팅되어 해당 스코프의 맨 위로 끌어올려졌기 때문입니다.

그러나 함수 표현식에서는 호이스팅이 변수 선언만 적용되며, 함수 표현식 자체는 호이스팅되지 않습니다.

위의 코드에서는 foo() 함수를 호출하기 전에 foo 변수가 선언되었지만, 변수만 호이스팅되고 함수 표현식은 호이스팅되지 않으므로 오류가 발생합니다.

✅ 요약하자면, 

호이스팅은 JavaScript 엔진이 코드를 해석하는 방식 중 하나로, 변수 및 함수 선언이 해당 스코프의 맨 위로 끌어올려지는 것을 의미합니다. 이는 코드의 가독성을 향상시키고 예측 가능한 동작을 유지하는 데 도움이 됩니다.