[Javascript] 자바스크립 호이스팅 (Hoisting)

자바스크립 호이스팅 (Hoisting)

1. 정의

- Hoisting is a term you will not find in the JavaScript docs. Hoisting was thought up as a general way of thinking about how execution context (specifically the creation and execution phases) work in JavaScript. 

- Another unusual thing about variables in JavaScript is that you can refer to a variable declared later, without getting an exception. This concept is known as hoisting

- 호이스팅은 실행문맥에 일반적인 방법으로 고안된다?

- 호이스팅은 변수 선언에 관련하여 동작하는 메카니즘?

2. 구현

1) 변수 선언

function hoist(){ console.log(a); var a = 10; console.log(a); } hoist();

- 실행 결과 : undefined, 10

- var a 의 선언이 중간 쯤에 되었지만 첫 번째 a를 출력 할 때 오류를 발생시키지 않고 undefined라는 데이터를 출력했다.

- hoist로 인하여 오류가 발생 하지 않았다. 결국 hoist는 변수 선언문의 유효 범위를 가장 위로 끌어올린 후에 변수 선언 위치에서 초기화 된다

2) 함수 선언

hoist(); function hoist(){ console.log(a); var a = 10; console.log(a); }  

- 실행 결과 : undefined, 10

- 함수 선언을 아래에서 하고 호출을 위에서 했지만 hoist 로 인하여 에러가 나오지 않고 정상적으로 작동 했다

- 만약 함수를 선언문을 사용하지 않고 표현식을 썼다면?

hoist(); var hoist = function(){ console.log(a); var a = 10; console.log(a); }  

- 실행 결과 : hoist is not a function(…)

- 표현식으로 작성된 함수는 hoisting 될 수 없다

3. 결론

- 함수는 선언문만 호이스팅 되며 변수 형으로 초기화 되었을 시 불가능

- 변수 형으로 선언된 것은  undefined 로 표시된다