라벨이 함수 선언식인 게시물 표시

[JavaScript] 호이스팅(Hoisting)

호이스팅(Hoisting)은 어디에 선언했나와 상관없이 항상 제일 위로 선언을 끌어 올리는 현상이다. 아래의 예시를 보면 function foo () { console . log ( a ); // undefined var a = 100 ; console . log ( a ); // 100 } foo (); 다른 프로그래밍 언어의 경우 위의 코드를 실행하면 a가 선언되지 않았는데 a를 호출했기 때문에 에러가 발생한다.  하지만 자바스크립트의 경우는 호이스팅을 통해 a의 선언을 함수 제일 위에서 자동으로 초기화 해주기 때문에 에러 없이 undefined가 출력된다.  위 코드는 아래와 동일한 역할을 하는 코드이다. function foo () { var a ; console . log ( a ); // undefined var a = 100 ; console . log ( a ); // 100 } foo (); 변수 이외에도 함수가 선언되기 이전에 함수를 호출하여도 에러가 발생하지 않으며 동작한다. foo (); function foo () { console . log ( a ); // undefined var a = 100 ; console . log ( a ); // 100 } 함수 작성 이전에 함수를 호출하였지만 JavaScript의 특이한 컨텍스트 실행 동작 방법으로인해 동작한다. 이러한 호이스팅은 유연함을 제공하지만 그만큼 오류도 많이 발생하게 되어 문제가 된다. 호이스팅은 혼란스러울 수 있기 때문에 함수를 호출하기 전에 최상단에 함수를 선언하는 습관을 들이는 것이 좋다. var를 사용하여 변수를 선언하거나 함수 선언문을 사용하였을때는 호이스팅이 발생하였는데  현재 es6로 넘어오면서 let, const 문법을 사용하거나 함수 표현식을 사용하게 되면서 호이스팅 현상이 발생하지 않게 되었다.??  사실 호이스팅이 발생한다. 그런데 var는 undefined로 값을 출력하지