자바스크립트 변수

자바스크립트 변수

모던 자바스크립트 Deep Dive 라는 책을 샀다. 출판사는 '위키북스'다.
당분간 이 책으로 공부하면서 블로그에 정리할 예정이다.

변수란?

하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름. 즉 값의 위치를 가리키는 상징적인 이름이다.

변수는 프로그래밍 언어의 컴파일러 또는 인터프리터에 의해 값이 저장된 메모리 공간의 주소로 치환되어 실행된다. 그 덕분에 개발자가 직접 메모리 주소를 통해 값을 저장하고 참조할 필요가
없고 안전하게 값에 접근이 가능하다. (자바스크립트는 인터프리터 언어이다)

할당과 참조

• 할당: 변수에 값을 저장(대입, 저장)
• 참조: 변수에 저장된 값을 읽어들임.

식별자

변수를 식별자라고도 하는데, 이는 어떤 값을 구별해서 식별할 수 있는 고유한 이름을 말한다.
식별자는 값이 아니라 메모리 주소를 기억하고 있다.

예를 들어, result라는 변수에 30이라는 값을 대입했다고 가정해보자.

let result = 30; // result의 메모리 주소 : 0x0669F913

result는 30이라는 값이 저장된 메모리의 주소를 기억하고 있고, 메모리 주소를 통해 저장된 값에 접근이 가능하다.

변수 선언과 undefined

자바스크립트에서는 var score; 이렇게만 작성해도 score라는 변수에 undefined라는 값이 암묵적으로 할당되어 초기화된다. 자바스크립트의 독특한 특징이라고 한다.

참고로 undefined는 자바스크립트의 primitive type중의 하나이다.

Primitive Type

• number
• string
• boolean
• undefined
• null
• Symbol(ES6)

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

console.log(score); // undefined
var score; // let, const의 경우가 아닌 var의 경우에만 해당한다.

위의 코드는 동작을 하지 않아야 할 것 같지만, 참조 에러가 나지 않고 undefined가 출력된다.
변수 선언이 소스코드가 한 줄씩 순차적으로 실행되는 런타임(runtime)이 아니라 그 이전 단계에서 먼저 실행되기 때문이다.

즉, 자바스크립트 엔진은 변수 선언이 소스코드의 아래에 있더라도 다른 코드보다 먼저 실행한다.
이처럼 변수 선언문이 코드의 위쪽으로 끌어 올려진 것처럼 동작하는 특징을 변수 호이스팅(variable hoisting)이라고 한다.

값의 할당

var score = 80;

자바스크립트에서 변수 선언은 런타임 이전에 실행되지만, 값의 할당은 소스코드가 순차적으로 실행되는 시점인 런타임에 실행된다.
따라서 score에 값 80을 할당하는 시점에는 이미 변수 선언이 완료된 상태이며, undefined로 초기화되어 있다.

위에 말했듯이 자바스크립트에서 변수 선언은 런타임 이전 단계에서 실행되고, 값의 할당은 런타임에 실행되기 때문이다.

또 하나 재미있는 사실은 만약의 우리가 변수 score의 값을 90으로 바꾼다고 했을 때, 80을 저장했던 메모리 공간에 90을 저장하는 것이 아니라 80이 존재하는 메모리 공간은 그대로 둔 채, 새로운 메모리 공간을 확보하고 그 공간에 숫자 90을 저장한다는 것이다.

 

텍스트로만 적으니까 뭔가 내가 적으면서도 좀 답답한 느낌이 있다. 맥북으로 간단하게라도 그림을 그릴 수 있는 것이 있는지 찾아보고 다음 포스팅부터 사용해보자.