호이스팅에 관해 정리한 글입니다.
Hoisting 이란?
- Hoisting의 의미 : 들어 올리기
변수나 함수를 해당 변수 및 함수 유효 범위의 최상단에 선언하는 것.
Javascript parsing 단계에서 재정렬 된다.
1
2
3
4
5
6
7
8
JavaScript에서 호이스팅(hoisting)이란, 인터프리터가
변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미합니다.
var로 선언한 변수의 경우 호이스팅 시 undefined로 변수를 초기화합니다.
반면 let과 const로 선언한 변수의 경우 호이스팅 시 변수를 초기화하지 않습니다.
- mdn -
물리적으로 코드가 이동하는 것이 아니다.
변수 호이스팅
- 변수 호이스팅은 var로 선언한 변수에서만 일어난다.
1
2
console.log(a);
var a; // undefined
함수 내부에서 변수가 선언되었을 경우, 선언만 함수의 최상위로 이동하고
함수 외부에서 선언되었을 때는 전역 범위에서 최상위로 이동한다.var로 선언한 변수는 호이스팅시 undefined로 변수를 초기화 한다.
1
2
3
4
5
6
7
function hello() {
console.log(a); //undefined
var a = 2;
console.log(a); //2
}
hello();
let과 const로 선언한 변수도 호이스팅의 대상이지만, 호이스팅의 영향을 받지 않는다.
함수 호이스팅
- 함수 선언식의 경우에만 호이스팅이 일어난다. 함수 표현식은 호이스팅이 일어나지 않는다.
함수 선언식
1
2
3
4
5
hello(); // hello
function hello() {
console.log("hello");
}
함수 표현식
1
2
3
4
5
hello(); // hello is not a function(undefined)
var hello = function () {
console.log("hello");
};
참고자료 (reference)
호이스팅
JavaScript - Hoisting(호이스팅)에 대해 알아보자
Javascript - Hoisting(호이스팅)이란?
#01. JavaScript의 Parsing - 01
[JavaScript] 호이스팅(Hoisting)이란
틀린점, 오타에 대한 것은 언제든지 알려주세요!