[모던자바스크립트 Deep Dive] 변수(Variable)

1. 변수

자바스크립트에서 변수란 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름을 말한다.

쉽게 설명해서, 프로그래밍 언어에서 변수는 값을 저장하고 참조하는 매커니즘으로 값의 '위치'를 가르키는 상징적인 이름이다.

변수이름 or 변수 명 : 메모리 공간에 저장된 값을 식별할 수 있는 고유한 이름
변수 값 : 변수에 저장된 값
할당 : 변수에 값을 저장하는 것
참조 : 변수에 저장된 값을 읽어 들이는 것

2. 식별자

변수 이름을 식별자라고도 하는데, 식별자란 '어떤 값을 구별해서 식별할 수 있는 고유한 이름'을 뜻한다.

식별자 특징

1. 식별자는 값 자체가 아닌 값이 저장된 주소를 기억하고 있다.
2. 식별자라는 용어는 변수 이름에만 국한되지 않으며 변수, 함수, 클래스 등의 이름도 모두 식별자라고 할 수 있다.
3. 메모리상에서 어떠한 값을 식별할 수 있는 이름은 모두 식별자라고 부른다.

 

3. 변수 선언

변수 선언이란 값을 저장하기 이한 메모리 공간을 확보하고 변수 이름과 확보된 메모리 공간의 주소를 연결하여 값을 저장할 수 있게 준비하는 것을 말한다,

var score; //변수선언

변수를 선언한 이후 값을 할당하지 않아도, 변수를 위해 확보한 메모리 공간에는 자바스크립트 엔진에 의해서 undefined라는 값이 암묵적으로 할당된다. 이는 자바스크립트의 특징이다!

4. 변수 선언의 실행 시점과 변수 호이스팅

console.log(score); // undefined
var score; //변수 선언문

위 처럼 변수를 참조하는 코드가 변수를 선언하는 선언문 보다 앞에 있어도 에러가 나오지 않고 undefined가 출력이 되는데 이 이유는 변수 선언이 소스코드가 순차적으로 실행되는 시점인 런타임(runtime)시점이 아니라 그 이전인 소스코드 평가 과정에서 실행되기 때문이다.

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

 

5. 값의 할당

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

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

위 두 코드는 자바스크립트 엔진에서 정확하게 동일하게 동작한다. 그 이유는 자바스크립트 엔진에서 변수 선언과 값의 할당을 두개로 나눠서 실행하기 때문이다.

여기서 주의할 점은 변수 선언과 값의 할당은 서로 실행 시점이 다르다. 변수 선언은 런타임 이전에 실행되지만, 값의 할당은 소스코드를 순차적으로 실행되는 런타임 시점에서 실행되기 때문이다.

console.log(score); //undefined
var score; 
score = 100; 
console.log(score); //100

console.log(score); //undefined
var score = 100;
console.log(score); //100

변수에 값을 할당할 대에는 이전 값 undefined가 저장되어 있던 메모리 공간을 지우고 할당 값을 새롭게 저장하는 것이 아닌 새로운 메모리 공간을 확보하고 그곳에 할당 값을 저장한다!
즉, 위 코드에서 두 console.log(score)에서 나타내는 값들이 서로 다른 주소를 가르킨다.