자바스크립트의 끌어올림(호이스팅) 이해하기
추천 자료: ASP.NET Core 인증 및 권한 부여
1. 호이스팅(끌어올림)이란?
자바스크립트에서 변수나 함수의 선언을 코드 상에서의 위치와 상관없이 스코프의 최상단으로 끌어올리는 현상을 호이스팅이라고 합니다. 이 현상은 자바스크립트의 실행 컨텍스트의 특징 때문에 발생합니다.
2. 변수의 호이스팅
자바스크립트에서는 var
로 변수를 선언할 때, 해당 변수의 선언 부분만 스코프의 최상단으로 끌어올려집니다. 할당은 원래 코드의 위치에서 이루어집니다.
console.log(name); // undefined
var name = 'John';
console.log(name); // John
이 코드는 내부적으로 아래와 같이 동작합니다:
var name; // 선언이 끌어올려짐
console.log(name); // undefined
name = 'John'; // 할당은 원래 위치에서
console.log(name); // John
3. 함수의 호이스팅
함수 선언식은 선언과 함께 정의도 같이 끌어올려집니다. 하지만 함수 표현식은 변수 호이스팅과 같은 방식으로 처리됩니다.
console.log(greet()); // Hello
function greet() {
return 'Hello';
}
console.log(sayHello); // undefined
var sayHello = function() {
return 'Hi!';
};
console.log(sayHello()); // Hi!
4. 주의사항
- ES6의
let
과const
는var
와 다르게 호이스팅은 되지만, 초기화 되지 않은 상태에서 참조하면 ReferenceError를 발생시킵니다. - 함수 호이스팅은 함수 선언식에만 적용되며, 함수 표현식에는 적용되지 않습니다.
5. 결론
호이스팅은 자바스크립트의 독특한 특징 중 하나입니다. 이를 이해하고 올바르게 코드를 작성하는 것은 중요하며, 특히 변수나 함수를 사용하기 전에 선언하는 습관을 기르는 것이 좋습니다.
추천 자료: .NET Blazor에 대해 알아보시겠어요? .NET Blazor 알아보기를 확인해보세요!