서적 모던 자바스크립드 Deep Dive 을 읽고 정리한 글입니다.
4장 변수 선언
- 변수 선언 : 변수를 생성하는 것 - 값을 저장하기 위해 메모리 공간을 확보하고 변수 이름과 확보된 메모리 공간의 주소를 연결 해서 값을 저장할 수 있게 준비하는 것.
- 변수를 사용하려면 반드시 변수 선언이 필요하다.
- 자바스크립트 변수 선언 키워드 : var,let,const
- es6 에서 let,const 키워드가 도입되기 이전까지 var 키워드는 유일한 변수 선언 키워드.
- var 키워드의 여러 단점을 보완하고자 let 과 const 키워드 도입.
변수 선언
- 변수를 선언하면 변수 이름을 등록하고 값을 저장할 메모리 공간을 확보한다.
var score;
- 변수를 선언하고 아직 변수에 값 할당은 하지 않은 상태이나 메모리 공간에는 자바스크립트 엔진에 의해 undefined이라는 값이 암묵적으로 할당되어 초기화 된다.
- undefined: js에서 자공하는 원시 타입의 값.
JS 에서 변수를 수행하는 단계
- 선언 단계 : 변수 이름을 등록해서 자바스크립트 엔진에 변수의 존재를 알린다.
- 초기화 단계 : 값을 저장하기 위한 메모리 공간을 확보하고 암묵적으로 undefine을 할당해 초기화 한다.
변수 선언의 실행 시점과 변수 호이스팅
console.log(score); //undefined
var score;
- 변수 선언문이 변수를 참조하는 코드 보다 뒤에 있다. java나 c언어였으면 에러가 발생할 코드이지만 js에서는 에러가 발생하지 않고 undefined가 출력된다.
- → 변수 선언이 런타임 ( 코드가 한줄씩 순차적으로 실행되는 시점)이 아니라 그 이전 단계에서 먼저 실행되기 때문.
- JS 엔진은 소스코드를 실행하기 전 소스코드 평과 과정을 거치면서 소스코드를 실행하기 위한 준비를 한다.
- 이 때 모든 선언문( 변수, 함수 선언문 등)을 찾아서 먼저 실행.
- 평가 과정이 끝나면 선언문을 제외한 소스코드를 한 줄씩 순차적으로 실행.
- ⇒ js엔진은 변수 선언이 소스코드의 어디에 있든 상관 없이 다른 코드보다 먼저 실행하므로 변수 선언이 소스코드 어디에 위치하는지와 상관 없이 어디서든 변수 참조 가능.
- 변수 호이스팅 : 변수 선언문이 코드의 선두로 끌어 올려진 것 처럼 동작하는 자바스크립트의 고유의 특징
- 변수 호이스팅으로 위의 코드에서 참조 에러 대신 초기화된 undefined가 출력된다.
- var 뿐만 아니라 let,const,function,class 키워드를 사용하여 선언하는 모든 식별자 (변수,함수,클래스 등)는 호이스팅 된다. 모든 선언문이 런타임 이전 단계에서 먼저 실행되기 때문.
값의 할당
변수 선언은 런타임 이전에 먼저 실행되지만, 값의 할당은 소스코드가 순차적으로 실행되는 시점인 런타임에 실행된다.
변수 선언과 값의 할당을 하나의 문으로 단축 표현해도 선언은 런타임 이전, 값 할당은 런타임에 이루어진다.
값을 할당 할 땐 undefined가 저장된 메모리 공간을 다시 사용하지 않는다. 새로운 메모리 공간을 확보하고 그곳에 값을 할당한다.
이후 변수를 재 할당 해도 새로운 메모리 공간을 확보하여 재할당한다.
추후 불필요한 값들은 가비지 콜렉터에 의해 메모리에서 자동으로 해제된다. ( 언제 해제될지는 예측할 수 없음)