[JavaScript] 변수

변수란?

컴퓨터가 '1 + 2'라는 연산을 하기 위해서는 1과 2를 기억해야 한다.
1과 2를 기억하기 위해서는 1과 2를 메모리에 저장해야 한다.
메모리는 1바이트 크기를 가진 메모리 셀의 집합으로 이루어져 있다.
컴퓨터는 메모리 셀에 1과 2를 저장한다.
그리고 1과 2가 저장된 주소에 접근하여 연산을 할 수 있다.

1과 2를 꺼내오기 위해 메모리 주소에 접근하는 작업은 컴퓨터에게 쉽다.
반면 사람에게는 각각의 메모리 주소를 알고 있는 것은 쉽지 않다.
또한 사람은 실수할 가능성이 있기 때문에 잘못된 메모리 주소에 접근하여,
시스템을 망칠 수도 있다.

이러한 이유로 인해 프로그래밍 언어에서는 변수라는 메커니즘을 제공한다.

var num1 = 1;
var num2 = 2;

우리는 변수에 값을 할당하고, 변수를 이용해 값에 접근한다.
그리고 이러한 변수를 식별자라고도 한다.

변수 생성

JavaScript는 인터프리터 언어다.
프로그램을 실행하면, 그 즉시 한 줄 한 줄 기계어로 변환한다.
이를 프로그램의 실행 단계라 하여 '런타임'이라 표현한다.
그러나 런타임에 들어가기 전에 선행작업이 있다.
먼저 코드에서 선언문(변수 선언, 함수 선언 등)들을 찾아서 실행한다.
본격적인 런타임 전에 미리 메모리를 확보하기 위해서다.
따라서 아래와 같은 현상이 발생한다.

console.log(num1); // undefined
var num1;

add(); // hahahoho

function add(){
	console.log("hahahoho");
}

위의 코드들은 에러가 없는 코드다.
이렇게 선언문들이 마치 맨위로 올라간 것과 같은 현상을 호이스팅이라 한다.

Javascript에서 변수를 생성하는 방법은 var, const, let 3가지다.
var를 사용할때 주의사항은 호이스팅과정에서 undefined로 초기화 된다는 것이다.
따라서 위의 코드에서 에러가 발생하지 않았다.
반면 let, const를 사용하는 경우에는 초기화과정이 없다.
따라서 메모리에 변수는 존재하지만,
"Cannot access 변수이름 before initialization"라는 오류가 발생한다.

변수에 값 할당

Javascript에서 변수의 선언과 값의 할당은 다른 시점에 이루어진다.

...
...
console.log(a); // undefined
var a = 1;
console.log(a); // 1
...

변수의 선언은 런타임 전에 일어나고, 값의 할당은 런타임에 일어난다.

변수에 값 재할당

var a = 1;
a = 10;
console.log(a); // 10

JavaScript에는 2가지 데이터 타입이 존재한다.
원시타입(Primitive Type)과 객체타입(Object Type)이다.
이 둘의 차이는 값을 변경할 수 있는지 여부다.
1과 같은 숫자는 Number라는 원시타입이다.
그렇다면 값을 변경할 수 없는 원시타입이 어떻게 값이 변경되었을까?

처음에 변수 a에는 1이라는 값이 존재한다.
이후 a에 10이라는 값을 할당하게 되면,

이와같이 새로운 메모리 주소에 10을 할당하고, 식별자 'a'를 옮긴다.
이렇게 JavaScript에서는 원시타입의 값은 변경되는 것이 아니라 재할당된다.

이렇게 되면 0x000AAB5 주소에는 식별자가 존재하지 않아 더이상 접근할 수 없다.
이러한 메모리 공간들은 주기적으로 작동하는 JavaScript의 가비지 컬랙터에 의해,
메모리 공간에서 해제된다.

참고
모던 자바스크립트 Deep Dive