호이스팅이 무엇인가요?

호이스팅의 개념

호이스팅(Hoisting)은 자바스크립트에서 변수 및 함수 선언이 해당 스코프의 상단으로 "끌어올려지는" 동작을 말합니다. 이는 코드 실행 전에 컴파일러 또는 인터프리터에 의해 처리되며, 코드 블록 내에서 변수와 함수가 선언된 위치와 상관없이 해당 블록의 최상위로 이동됩니다.

호이스팅의 규칙

호이스팅은 다음과 같은 규칙을 따릅니다:

1. 변수 호이스팅:

   • 변수 선언(var)은 해당 스코프의 상단으로 끌어올려집니다. 변수의 할당은 호이스팅되지 않으며, 실제 선언이 있는 줄에서 실행됩니다.
   • 변수 선언 전에 변수를 사용하면, 변수는 undefined로 초기화됩니다.

   예시:

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

2. 함수 호이스팅:

   • 함수 선언문(function declaration)은 해당 스코프의 상단으로 끌어올려집니다. 따라서 함수를 선언하기 전에 호출해도 정상적으로 실행됩니다.

   예시:

   sayHello(); // "Hello!"
   
   function sayHello() {
     console.log("Hello!");
   }

   • 함수 표현문(function expression)은 해당 스코프의 상단으로 끌어올려집니다. 따라서 함수를 선언하기 전에 호출해도 정상적으로 실행됩니다.

   예시:

   sayHello(); // "undefined"
   
   const sayHello = function() {
     console.log("Hello!");
   }

호이스팅은 코드의 가독성과 예측성을 해치는 요소일 수 있으므로, 변수 및 함수는 선언 위치에서 사용하는 것이 좋습니다. 코드를 이해하기 쉽고 유지보수하기 편하게 하기 위해 변수와 함수 선언을 스코프의 상단에 명시적으로 작성하는 것이 좋습니다.