[JavaScript] 호이스팅(Hoisting)

Hoisting

• JavaScript 엔진과 브라우저에서 스크립트를 로드할 때
  전체 스크립트를 확인해서 함수를 찾은 뒤 자동으로 로드하고 등록해서
  실제 사용하는 코드 아래에 함수를 작성하도록 하는 것이다.
• 호이스팅은 변수도 함수와 같이 동일하게 적용된다.

실행예제

var

console.log(userName) // undefined

var userName = 'Max';

let, const

console.log(userName) // Error

let userName = 'Max';

• Error : 초기화 전의 userName에 액세스 할 수 없다
  

작동법 비교

let, const

• 호이스팅은 일종의 선언일 뿐이며 undefined로 초기화되지 않는다.
• 변수를 사용하기 전에 강제로 선언하는 것이 더 명확하기 때문에 강제로 선언을 맨 위로 옮긴다.

var

• 호이스팅은 선언과 함께 undefined로 초기화된다.

• 선언을 맨 위로 옮길 수 있지만 강제는 아니다.

• 이전에 선언한 걸 다시 선언할 수 있다. → let, const 의 경우 에러발생

  var userName = 'Max';
  var userName = 'Manuel';
  
  console.log(userName); // 'Manuel'

참고

【한글자막】 JavaScript 완벽 가이드 : 초급 + 고급 마스터 과정