자바스크립트 변수를 선언하고 값을 할당하는 일련의 과정 설명하기

Q. 자바스크립트에서 변수를 선언하고 값을 할당하는 일련의 과정을 설명해보세요.

 

 

값의 생성과 변수에의 할당

 

(1) 변수 선언 키워드 (var, let, const)로 변수 이름을 선언하면, 메모리 공간을 확보하여 값을 저장하기 위한 준비를 한다.

- 메모리 공간을 확보하고

- 변수 이름과 확보된 메모리 공간의 주소를 연결한다.

-> 즉 값을 저장할 수 있게 준비하는 것이다.

-> 이 메모리 공간은 해제되기 전까지는 보호된다.

 

(2) 자바스크립트 엔진은 변수 선언을 2단계에 걸쳐 수행한다.

- 선언 단계: 변수 이름을 실행 컨텍스트에 등록해서 자바스크립트 엔진에 변수의 존재를 알린다. 

- 초기화 단계: 값을 저장하기 위한 메모리 공간을 확보하고, 암묵적으로 undefined를 할당해 초기화한다.

    (초기화 단계를 거치지 않으면, 확보된 메모리 공간에는 이전에 사용했던 쓰레기 값이 남아있을 수 있다. 자바스크립트 엔진은 암묵적으로 초기화를 수행하기 때문에 상관 없다.)

 

(3) 변수 선언은 코드가 한 줄씩 순차적으로 실행되기 이전에, 소스코드의 평가 과정에서 완료된다.

console.log(score); // undefined. ReferenceError(참조 에러)가 아닌 undefined 출력

var score; // 변수 선언문

- 소스코드의 평가 과정에서 자바스크립트 엔진은 변수 선언을 포함해 모든 선언문을 찾아내 먼저 실행한다.

- 소스코드의 평가 과정이 끝나면, 비로소 모든 선언문을 제외하고 소스코드를 한 줄씩 순차적으로 실행한다.

- 이렇게 변수 선언문이 코드의 선두로 마치 끌어올려진 것처럼 동작하는 것을 변수 호이스팅이라고 한다.

 

(4) 변수에 값을 할당할 때는 소스코드의 평가 과정 이후, 소스코드가 순차적으로 실행되는 시점인 런타임에 실행된다.

var score = 100; // 변수 선언과 값의 할당

- 변수 선언+값의 할당을 하나의 문으로 단축해도, 소스코드 평가 과정에서 변수 선언이, 런타임 시점에 값의 할당이 이루어진다.

- 변수에 값을 할당할 때는, 기존에 undefined가 할당된 공간을 비우고 그 공간에 100을 저장하는 게 아니라, 새로운 메모리 공간을 확보하고 그곳에 할당 값 100을 저장한다.

- 더 이상 메모리를 사용할 필요가 없으면 변수에 null을 할당해주면 된다. 

 

출처: <모던 자바스크립트 Deep Dive> 4장