본문 바로가기

잡다한 기술

[JAVA SCRIPT/자바 스크립트]호이스팅(Hoisting)를 알아보자




# 호이스팅 이란?



호이스팅(Hoisting)은 사전적 의미로 끌어 올리기 라는 의미를 가지고 있는 단어이며,

실제로 하는 일도 사전적 의미와 동일하다. 모든 선언(var, let, const, function 등)들을 

어느 위치에 호출하던지 간에 자바스크립트(Javascript)는 그 선언을 맨 위로 끌어올린다.

어떤것이든 설명을 들어도 잘 이해가 안간다.

예제를 한번 보자


1
2
3
4
5
6
7
console.log(temp);        // 출력 : undefined
 
var test = function(){
    console.log(temp);    // 출력 : undefined
}();
 
var temp = "This is Korea";
cs



예제를 보면 temp라는 변수를 출력하고 있다.

보통 C나 JAVA같은 언어는 저런식으로 출력하면 오류가 난다.

하지만 Javascript는 호이스팅으로 인해 선언을 맨 위로 끌어 올린 것이다.

즉 호이스팅이 되면 아래와 같아지는 것이다.



1
2
3
4
5
6
7
8
9
10
11
var temp;
 
console.log(temp);        // 출력 : undefined
 
var test = function(){
    console.log(temp);    // 출력 : undefined
}();
 
temp = "This is Korea";
 
console.log(temp);        // 출력 : "This is Korea"
cs



물론 let과 const도 호이스팅이 된다.

하지만. TDZ(Temporal dead zone) 때문에 선언전에 참조하면 Reference 오류가 발생한다.

 



# 마무리


위 포스트는 제가 직접 제작한 것 입니다.

그렇기 때문에 틀린점이나 설명이 엉성한 점이 존재할 수 있습니다.

만약 틀린점이나 설명이 엉성한 부분이 존재하면 댓글로 알려주세요.

빠른 처리 하도록 하겠습니다.


티스토리 앱으로는 댓글 이용이 불가능 하므로 웹 브라우저로 봐 주세요

(URL : http://junprogramer.tistory.com/)


읽어주셔서 감사합니다.