Variable Hoisting

Kichang Kwon·2021년 8월 9일
0

Java Script

목록 보기
1/1

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

console.log(name);
var name = 'K';

변수 선언문보다 변수를 참조하는 코드가 앞에 있다. 자바스크립트는 인터프리터에 의해 한 줄씩 순차적으로 실행되므로 ReferenceError가 발생할 것으로 예상되나, undefined가 출력된다.

이는 변수 선언이 소스코드가 한 줄씩 순차적으로 실행되는 시점, 즉 런타임이 아니라 그 이전 단계에서 먼저 실행되기 때문이다.

변수 선언은 2단계로 나뉘어져 수행된다. 
1. 선언 단계: 이름을 등록해서 자바스크립트 엔진에 변수의 존재를 알린다.
2. 초기화 단계: 값을 저장하기 위한 메모리 공간을 확보하고 암묵적으로 undefined를 할당해 초기화 한다.

자바스크립트 엔진은 소스코드의 평가 과정에서 모든 선언문(var, let, const, function, function*, class)을 찾아 먼저 실행하고, 평가 과정이 끝나면 이를 제외한 소스코드를 한 줄씩 순차적으로 실행한다.

// example01
var name = 'K';
// example02
var name;
name = 'K';

example01과 example02는 동일하게 동작한다.
호이스팅에 의해 name이 우선 변수 선언을 수행하고, 런타임 시점에서 값이 할당된다.

let, const, class

let, const, class 키워드로 선언한 변수는 선언 단계와 초기화 단계가 분리되어 진행된다. 런터임 이전에 자바스크립트 엔진에 의해 암묵적으로 선언 단꼐가 먼저 실행되지만 초기화 단계는 변수 선언문에 도달했을 때 실행된다. ES6에서 도입된 위 키워드를 사용한 선언문은 호이스팅이 발생하지 않는 것처럼 동작한다.

profile
한 줄 소개

0개의 댓글