[자바스크립트] (함수의 표현) 함수 선언 후 undefined & hoisting 이란?

[자바스크립트] 함수 선언 후 undefined & hoisting 이란?

 

 

 

 

 

 

아래 예시를 참고하자

 

1)은 스크립트 순서와 상관없이 함수를 런타임 언제든 호출하여 사용이 가능하지만,

2)는 함수가 할당이 되는 그 시점까지의 스크립트를 지난 후에야 호출하여 사용이 가능하다.

 

 

 

 

---

1) 함수 선언문 

function add(x,y) {

     return x+y

} 

 

 

 

2) 함수 표현식 (함수명 생략)

var add = function(x,y) {

     return x+y

}

---

 

 

함수 선언문은, 런타임 이전에 이미 일반변수와 같이 선언되어 '호이스팅'된다.

함수 표현식은, 런타임 이전에 undefined 로 변수를 초기화시키고,

런타임 시 해당 함수가 할당된다.

 

 

 

 

 

 

 

 

 

 

호이스팅(hoisting) 이란?

 

=> 끌어올림

 

 

 

 

실제로 일어나는 현상은 아니지만, 이해를 돕기 위해 이런 표현을 사용한다.

스크립트가 실행될 때에 가장 먼저 하는 일은,

스크립트 내 선언된 모든 변수를 위해 메모리 자리를 마련하는 일이다.

 

 

 

 

이 때, [원시변수도, 객체도, 배열도, 함수도,] 변수에 선언이 되어 있다면

메모리에 자리를 마련해주게 되는데,

이를 끌어올려져서 자리를 마련해준다고 '호이스팅'이라 한다. 

 

 

 

 

 

그러나,

자리만 마련해줬지, 값을 할당했다는 말이 아니다. 즉, 빈 자리로 일단 배치만 해주었다는 것.

 

 

 

 

그런 이유로, 

2)는 "add" 라는 변수명의 빈 자리만 있을 뿐, 실제 함수는 아직 할당되지 않은 상태다.

추후, 스크립트가 진행되며 var add = function() 부분이 지나기 전까지는 말이다.

 

 

 

 

 

 

 

 

 

 

간단하쥬?