【 JS 초급 】호이스팅 ( Hoisting )

어떤 변수,함수가 초기화 및 선언될 때

변수, 함수등의 선언부를 스코프 최상단으로 끌어올리게 된다.

function a(b){

return b;
}
console.log(a(b));
var b="hello";

 

이런 간단한 함수가 작성되었다 하였을 때

b는 함수 뒤에 선언이 되었기 때문에 실행 오류를 내뱉는다고 생각될 수도 있지만

 

호이스팅이란 개념은 변수가 선언을 먼저 하도록 돕는다.

이는 함수나 변수가 3단계에 걸쳐 할당되기 때문이다.

 

1. 선언

2. 초기화

3. 할당

 

위 코드의 예제에서 var b="hello"; 는 실행했을 때 선언과 초기화 할당이 모두 동시에 일어난다고 보면 되고

호이스팅은 선언부를 스코프의 최상단에 올리게 된다.

 

즉 console.log(a(b)); 가 작동했을 때, 아직 변수는 할당되지 않았음으로 Undefined 를 띄우게 된다.

 

여기서, var , let, const 구문의 차이가 발생하게 되는데,

var는 위와 같이 호이스팅이 발생하지만

let, const는 TDN이라는 검사 할당부의 조건에 따라 선언을 무효화 시키기 때문에 초기화가 발생하지 않는다.

따라서,  let const는 사용할 수 없다.

 

 

호이스팅은 실제 코드를 작성할 때 예상치 못한 오류를 발생시킬 수 있으므로 

주 된 원인인 var 구문의 사용은 지양하는 편이 좋다고 볼 수 있다.