Skip to content

JS/SevelteKit

hoisting : 메모리에 위치만 잡아주고 값은 hoisting 되지 않음

Author
siwon
Date
2023-10-14 20:16
Views
436

자바스크립트에는 "호이스팅(hoisting)"이라는 개념이 있으며, 때로는 개발자들에게 혼동을 일으키는 원인이 될 수 있습니다. 호이스팅은 변수 및 함수 선언이 컴파일 단계에서, 심지어 코드의 나중에 선언되었다고 보이더라도 해당 스코프의 맨 위로 이동되는 동작을 의미합니다.


호이스팅의 주요 특징은 다음과 같습니다:


1. 변수 호이스팅:

   - 변수 선언(`var`, `let`, 또는 `const`를 사용한)은 해당 함수 또는 전역 스코프의 맨 위로 호이스팅됩니다.

   - 그러나 변수 할당은 호이스팅되지 않습니다. 맨 위로 이동하는 것은 선언만 해당됩니다.


예시:


```javascript

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

```


이 예시에서 변수 `x`의 선언은 스코프의 맨 위로 호이스팅되지만 할당부(`x = 5`)는 그렇지 않습니다. 따라서 할당되기 전에 `x`의 값을 로깅하려고 하면 `undefined`가 출력됩니다.


2. 함수 호이스팅:

   - 함수 선언 또한 해당 함수 또는 전역 스코프의 맨 위로 호이스팅됩니다.

   - 이것은 함수가 실제 선언된 코드보다 나중에 호출할 수 있음을 의미합니다.


예시:


```javascript

sayHello(); // 출력: "Hello, World!"
function sayHello() {
  console.log("Hello, World!");
}

```


이 예시에서 `sayHello` 함수는 맨 위로 호이스팅되므로 실제 선언 이전에 호출할 수 있습니다.


중요한 점은 호이스팅이 선언에만 적용되며 초기화에는 적용되지 않는다는 것입니다. 함수 선언과 변수 선언은 호이스팅되지만 할당 또는 초기화는 호이스팅되지 않습니다. 또한, `var`, `let`, 및 `const`의 동작은 스코프 및 호이스팅 관점에서 차이가 있습니다. `var`는 함수 스코프이며 해당 함수의 맨 위로 호이스팅되지만 `let` 및 `const`는 블록 스코프이며 해당 블록 내에서만 호이스팅되며 선언 이전에 접근할 수 없습니다.

중요한 고려 사항: 호이스팅은 코드 흐름을 이해하는 데 도움이 될 수 있지만 코드 가독성을 유지하고 예기치 않은 동작을 피하기 위해 변수를 해당 스코프의 맨 위에 선언하고 함수를 호출하기 전에 정의하는 것이 좋은 관행입니다.