꾸생의 블로그 :: JavaScript 메모리와 데이터

컴퓨터는 모든 데이터를 0과 1로 다룬다. 여기서 0 또는 1 하나를 다루는데 필요한 단위로 비트(bit)가 등장한다.

8개의 비트가 모여 1바이트(Byte)가 되는데, 1bit 마다 0과 1 두 가지의 값을 표현할 수 있어 1Byte는 총 256(2^8)개의 값을 표현할 수 있다. 그러면 2바이트는16개의 비트가 모이니 65536(2^16)개의 값을 표현한다.

💡

식별자: 변수명 변수: 변할 수 있는 수

변수선언과 데이터 할당


var a;  // 변수 선언
a = '123' // 변수에 데이터 할당

var a  '123' // 변수 선언과 동시에 데이터 할당

변수영역

데이터 영역

주소	…	1002	1003	1004	1005
데이터	ㅤ	ㅤ	식별자: a 값: @5004	ㅤ	ㅤ
주소	…	5002	5003	5004	5005
데이터	ㅤ	ㅤ	ㅤ	‘123’	ㅤ

초록색 배경은 변수영역의 메모리공간이고 보라색 공간은 데이터 영역의 메모리 공간이다.

변수 영역에는 변수의 식별자와 값 정보가 들어있는데, 값에는 원본 값 데이터가 들어가는 것이 아닌 데이터 영역 주소값이 들어간다.

왜 변수와 데이터 영역을 따로 나누어 값을 관리하는지는 중복되는 데이터를 줄이기 위해서다.


var a = '123'
a += '456'

주소	…	1002	1003	1004	1005
데이터	ㅤ	식별자: a 값: @5004	ㅤ	ㅤ	ㅤ
주소	…	5002	5003	5004	5005
데이터	ㅤ	ㅤ	‘123’	‘123456’	ㅤ

변수 a에 ‘123’을 할당하면 위 @1002 메모리에 값은 @5003주소가 담긴다. 그런데 a 변수를 다른 값으로 더한 후 할당하면 데이터 영역의 값은 그대로 남아있고 새로운 주소에 변경된 데이터가 새롭게 담긴다. 전에 데이터가 다시 사용되면 그 떄 활용한다.

💡

데이터 영역의 값은 가비지 컬렉팅 당하지 않는 한 숫자든 문자든 한 번 만든 값은 바꿀 수 없다.

가비지 컬렉터는 참조 카운트가 0인 메모리 주소를 수거해서 메모리 사용량이 포화 상태에 임박할 때마다 자동으로 수거해 새로운 값을 할당할 수 있는 빈 공간으로 만든다.

객체의 가변값

기본형 데이터는 불변값으로 가비지 컬렉터한테 수거되지 않는 한 메모리에 남아있는다. 객체의 경우는 다르니 한 번 알아보자!


var obj1 = {
	a: 1,
	b: 'aaa',
}

변수영역 데이터영역

객체 @5002의
변수 영역

주소	…	1002	1003	1004	1005
데이터	ㅤ	식별자: obj1 값: @5002	ㅤ	ㅤ	ㅤ
주소	…	5002	5003	5004	5005
데이터	ㅤ	@7001~ `?`	ㅤ	1	‘aaa’
주소	…	7001	7002	ㅤ	ㅤ
데이터	ㅤ	식별자: a 값: @5004	식별자: b 값: @5005	ㅤ	ㅤ

obj1을 가리키는 변수 영역의 @1002는 값이 데이터 영역의 @5002 쪽을 가리키고 또 @7001~? 을 가리킨다. ?인 이유는 객체 프로퍼티를 저장하기 위한 메모리 영역은 크기가 정해져있지 않고 필요한 시점에 동적으로 확보하기 때문이라 한다.

하긴 JS에서 상수로 객체하나 선언해주고 식별자 아무거나 넣고 값을 할당해주면 잘 들어가는 이유가 이것 때문이였다.

정리

JS 데이터 타입은 기본형과 참조형이 있고, 기본혀은 불변값, 참조형은 가변값이다.

변수는 변경 가능한 데이터가 담기는 공간이고 식별자는 변수의 이름이다.

변수를 선언하면 메모리에 빈 공간에 식별자를 저장하고 값은 undefined를 할당한다.

참조형 데이터는 여러 개의 변수를 모은 ‘그룹’으로 참조형 데이터를 ‘가변값’으로 여겨야함