Hoisting

sohyeon kim·2022년 4월 15일
0

React & Javascript

목록 보기
6/41

호이스팅(Hoisting)

console.log(score); //undefinded
var score; // 변수 선언문

변수 선언문인 var score; 보다 변수를 참조하는 코드인 console.log(score)가 앞에 있다. 자바스크립트 코드는 인터프리터에 의해 한 줄씩 순차적으로 실행되므로 console.log(score);가 가장 먼저 실행되고 순차적으로 다음 줄에 있는 코드를 실행한다. 이 경우에 console.log(sore)가 실행되는 시점에는 아직 변수가 선언되기 이전이므로 위 코드를 실행하면 참조 에러(ReferenceError)가 발생해야하지만 undefined가 출력된다.

이는 변수 선언이 소스코드가 순차적으로 실행되는 런타임 이전 단계에서 먼저 실행된다는 증거다.

이처럼 변수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 자바스크립트 고유의 특징을 변수 호이스팅 variable hoisting 이라 한다.

즉 호이스팅은 코드를 실행하기 전 변수선언을 해당 스코프의 최상단으로 끌어올리는 것이 아니다.

호이스팅은 코드 실행하기 전 변수선언이 해당 스코프의 최상단으로 끌어 올려진 것 같은 현상을 말한다.

또한 변수 선언뿐 아니라 var, let, const, function, function*, class 키워드를 사용해서 선언하는 모든 식별자(변수, 함수, 클래스 등)는 호이스팅 된다.

모든 선언문은 런타임 이전 단계에서 먼저 실행되기 때문이다.

  • 런타임(runtime): 변수 선언이 소스코드가 한 줄씩 순차적으로 실행되는 시점
  • 참조에러(ReferenceError): 식별자를 통해 값을 참조하려 했지만 자바스크립트 엔진이 등록된 식별자를 찾을 수 없을 때 발생하는 에러이다.


https://www.w3schools.com/js/js_hoisting.asp
참고: 모던 자바스크립트 deep dive

profile
slow but sure

0개의 댓글