4.4 변수 선언의 실행 시점과 변수 호이스팅
console.log(score); //undefined
var score;자바스크립트 코드는 인터프리터에 의해 한 줄씩 순차적으로 실행된다. 따라서 위의 코드를 보면 score가 선언 되기 전에 console.log(score)를 통해 참조되므로 참조 에러가 발생할 것처럼 보인다. 하지만 예상과 달리 undefined가 출력된다. 이는 변수 선언이 런타임 이전 단계에서 먼저 실행되기 때문이다.
자바스크립트 엔진은 소스코드를 실행하기 앞서 소스코드의 평가 과정을 거치며 실행 준비를 한다. 이때 평가 과정에서 변수 선언을 포함한 모든 선언문을 소스코드에서 찾아내 먼저 실행한다. 즉, 자바스크립트 엔진은 변수 선언이 소스코드의 어디에 있든 상관없이 다른 코드보다 먼저 실행한다. 따라서 위의 코드에서 undefined가 출력된다.
이처럼 변수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 자바스크립트 고유의 특징을 변수 호이스팅 이라고 한다. 변수 선언뿐 아니라 var, let, const, function, class 키워드를 사용해 선언하는 모든 식별자는 호이스팅된다. 이는 모든 선언문은 런타임 이전 단계에 실행되기 때문이다.
4.5 값의 할당
var score; //변수 선언
score = 80; //값의 할당var score = 80; //변수 선언과 값의 할당변수에 값을 할당할 때는 할당 연산자 '='을 사용한다. 값의 할당은 위철머 2개의 문으로 나누어 하거나 하나의 문으로 표현할 수 있으며 이는 동일하게 동작한다. 이때 변수 선언은 런타임 이전에 먼저 실행되지만 값의 할당은 런타임에 실행된다.
console.log(score); // 1. undefined
var score; // 변수 선언
score = 80; // 값 할당
console.log(score); // 2. 80위 코드에서 선언은 런타임 이전, 값 할당은 런타임에 실행되므로 1번에서는 undefined, 2번에서는 80이 출력된다. 이는 변수의 선언과 값의 할당을 하나의 문장으로 표현해도 변함이 없다. 즉, 선언 시에 변수에 undefined가 할당되어 초기화 된 후 80이 할당된다. 이때 undefined가 저장되어 있던 메모리 공간을 지우고 그 공간에 80을 새롭게 저장하는 것이 아니라 새로운 메모리 공간을 확보하고 그곳에 80을 저장한다.
4.6 값의 재할당
이미 값이 할당되어 있는 변수에 새로운 값을 할당하는 것을 재할당이라고 하며 var 키워드로 선언된 변수는 값을 재할당할 수 있다. var 키워드로 선언한 변수는 위에서 말했듯 선언과 동시에 undefined로 초기화되기 때문에 엄밀히 말하자면 변수에 처음으로 값을 할당하는 것도 재할당이다.
var score = 80;
score = 90;위의 코드대로 변수에 80을 할당한 뒤 90을 재할당 한다면
- 선언시에 메모리공간을 확보해 undefined가 할당되며 초기화
- 새로운 공간을 확보하고 80을 할당
- 다시 새로운 공간을 확보하고 90을 할당
위의 단계를 거치게 된다. 이렇게 되면 변수의 이전 값인 undefined와 80은 어떤 식별자와도 연결되어 있지 않아 필요가 없어진다. 이러한 불필요한 값들은 가비지 콜렉터에 의해 메모리에서 자동 해제된다. 단 언제 해제될지는 예측할 수 없다.
