변수 선언
변수 선언이란 변수를 생성하는 것을 말한다. 즉 값을 저장하기 위한 메모리 공간을 확보하고 변수 이름과 확보된 메모리 공간의 주소를 연결해서 그 이름으로 값을 저장하고 다룰 수 있게 하는 것이다.
변수를 사용하려면 선언이 필요하다. 변수를 선언할 때는 var, let, const 키워드를 사용한다. var키워드에는 여러 단점이 있다. 그 중 대표적인 것은 var가 함수 레벨 스코프를 지원하는 것이다. 이로 인해 의도치 않게 전역 변수가 선언되어 부작용이 발생하기도 한다.
변수 선언은 다음과 같은 2 단계를 따른다.
•
선언 단계: 변수 이름을 등록해서 자바스크립트 엔진에 변수의 존재를 알린다.
•
초기화 단계: 값을 저장하기 위한 메모리 공간을 확보하고 암묵적으로 undefined를 할당해 초기화한다.
var 키워드를 사용한 변수 선언은 선언 단계와 초기화 단계가 묶여있다. 변수 선언 단계에 들어가면 그 즉시 초기화도 함께 진행한다. 그리고 값은 암묵적으로 undefined가 할당된다.
만약 선언하지 않은 식별자에 접근하면 ReferenceError가 발생한다. 이는 식별자를 통해 값을 참조하려 했지만 자바스크립트 엔진이 등록된 식별자를 찾을 수 없을 때 발생하는 에러다.
변수 호이스팅
console.log(score); // undefined
var score;
Plain Text
복사
위 코드를 보면 변수 선언보다 참조가 앞서있다. 자바스크립트는 인터프리터에 의해 한 줄씩 순차적으로 실행되므로 참조와 선언의 순서로 실행된다. 그러므로 ReferenceError가 발생한다고 생각하기 쉽지만 실제로는 undefined를 출력한다. 그 이유는 변수 선언이 런타임 그 이전 단계에서 먼저 실행되기 때문이다.
자바스크립트 엔진은 소스코드를 한 줄씩 순차적으로 실행하기에 앞서 소스코드의 평가 과정을 거치면서 소스코드를 실행하기 위한 준비를 한다. 이때 소스코드 실행을 위한 준비 단계인 평가 단계에서 자바스크립트 엔진은 변수 선언을 포함한 모든 선언문을 소스코드에서 찾아내 먼저 실행한다. 그리고 소스코드의 평가 과정이 끝나면 비로소 변수 선언을 포함한 모든 선언문을 제외하고 소스코드를 한 줄씩 순차적으로 실행한다.
이처럼 변수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 자바스크립트 고유의 특징을 변수 호이스팅이라고 한다. 그리고 변수 선언뿐만 아니라 var, let, const, function, class 키워드를 사용해서 선언하는 모든 식별자 또한 호이스팅된다.
값의 할당
// 1
var score;
score = 80;
// 2
var score = 80;
Plain Text
복사
1번 코드와 2번 코드는 실제로 같은 행동을 한다. 선언 -> 암묵적 초기화(undefined) -> 할당(80)의 단계를 똑같이 거친다는 말이다. 그렇지만 호이스팅과 관련해서 주의해야 한다. 변수 선언과 암묵적 초기화는 런타임 이전에 실행되지만 할당은 런타임에 실행된다. 다음을 보자.
console.log(score); // undefined
var score;
score = 80;
console.log(score); // 80
Plain Text
복사
그리고 위 코드는 다음의 코드와 똑같은 결과를 내놓는다.
console.log(score); // undefined
var score = 80;
console.log(score); // 80
Plain Text
복사
다음의 코드는 조금 더 주의깊게 봐야 이해할 수 있다.
console.log(score); // undefined
score = 10;
var score;
console.log(score); // 10
Plain Text
복사
값의 재할당
변수에 값을 재할당하면 이전 값은 사라지고 새 값이 할당된다. 이 때 기존 메모리 공간을 지우고 그 메모리 공간에 재할당 값을 저장하는 것이 아니라 새로운 메모리 공간을 확보하고 그 메모리 공간에 숫자 값 90을 저장한다.
