본문 바로가기
컴퓨터/Front

[JavaScript] 호이스팅! hoisting 간단 뜻(면접준비용 깊은 원리는ㄴ🙄)

by 버니케이 2022. 8. 3.
반응형

 

 

글 쓰기 전에...

 

선언:

let a

 

할당:

a = 'a';

 

 


 

호이스팅

 

이거 오류 날까??

console.log(이름);
var 이름 = '버니';
console.log(이름);

안남😮

왜 안나냐면 호이스팅 때문인데

 


 

 

호이스팅 뜻

 

호이스팅: 변수 선언을 맨 위로 끌고오는 현상

 

Js 는 위에서 밑으로 구문을 해석하는데,

해석하면서 변수나 함수가 선언되어있으면 바로바로 맨 위로 끌고 올라온다.

어차피 원래 변수는 heap 에 넣어놓음

 

 

 

 

 

 

 

변수 선언이랑 할당은 이렇게 동시에 할 수 있는데

var 이름 = '버니';

이걸 두개로 쪼갤 수 있다. (다들 알다시피)

var 이름;
이름 = '버니';

자바스크립트는 구문을 해석하면서 

저런식으로 쪼갠다음에...

변수 선언부분을 위로 다올려버린다.

 

 


호이스팅 예시

 

이런 JavaScript 구문이 있다고 한다.

document.getElementById('잉').addEventListener('click',function(e){
    console.log(this);  
    console.log(e.currentTarget);
});


var 나이 = 30;

function 더블더하기야 (a) {
    return a+a;
};

let 이름obj = {name:'토끼',nick:'버니'};

 

그리고 JavaScript 는 밑에처럼 해석해놓는다.

// 선언한거 위로 다 올려버림
var 나이;

function 더블더하기야(){};

let 이름obj;

// ---------------------------------------------------------

// 구문 시작

document.getElementById('잉').addEventListener('click',function(e){
    console.log(this);  
    console.log(e.currentTarget);
});


나이 = 30;

function 더블더하기야(a) {
    return a+a;
};

이름obj = {name:'토끼',nick:'버니'};

 

끝!

 

 

반응형

댓글