JS 원시 자료형과 참조 자료형 - [Codestates] Section1

 

타입 기초에서 학습한 number, string, boolean과 같은 고정된 저장 공간을 차지하는 데이터를 모두 원시 자료형(primitive data type)이라고 합니다. 반면에 대량의 데이터를 다루기에 적합한 배열과 객체는 참조 자료형(reference data type)이라고 분류합니다. 이런 분류는 데이터를 저장하는 방식에 따른 분류입니다.

 

원시 타입 데이터 (원시 자료형)

number, booleran, null, undefined, string

사물함에 이름표 달고 그 안에 바로 데이터를 넣음 

데이터 값을 복사하기에 복사 후 변경해도 기존의 데이터에 영향이 없음 

 

참조 타입 데이터

array, object, function

heap 이라는 빈공간을 달고 

사물함에 이름표를 달고 주소를 넣는다. 

주소 및 데이터는 heap 에서 찾는다. 

참조 데이터는 주소 자체를 복사하기 때문에 복사 데이터에서 원소 변경하면 주소의 데이터가 변경되기에 기존 데이터에도 영향이 있음

 

 

---

원시 자료형 

JavaScript에서 원시 타입의 데이터(primitive data types; 원시 자료형)는 객체가 아니면서 method를 가지지 않는 6 가지의 타입

string, number, bigint, boolean, undefined, symbol, (null)

을 말합니다.

원시 자료형은 모두 "하나"의 정보, 즉, 데이터를 담고 있습니다.

 

참조 자료형은 딱 봐도 하나의 주제는 있지만 분명 서로 다르고, 여러 개의 데이터를 가지고 있는 것을 확인하실 수 있습니다.

 

 

변수에는 하나의 데이터만 담습니다.

 const num1 = 123;
 const num2 = 123456789;

이렇게 변수에는 데이터의 크기와는 관계없이 하나의 데이터만 담을 수 있습니다. 원시 자료형은 값 자체에 대한 변경이 불가능(immutable)하지만, 변수에 다른 데이터를 할당할 수는 있습니다.

 const num1 = 123;
 const num2 = 123456789;

이렇게 변수에는 데이터의 크기와는 관계없이 하나의 데이터만 담을 수 있습니다. 원시 자료형은 값 자체에 대한 변경이 불가능(immutable)하지만, 변수에 다른 데이터를 할당할 수는 있습니다.

 

 

 

---

참조 자료형

avaScript에서 원시 자료형이 아닌 모든 것은 참조 자료형입니다. 배열([])과 객체({}), 함수(function(){})가 대표적입니다. 이런 자료형을 JavaScript에서는 참조 자료형(reference data type; 참조 타입)이라고도 부릅니다.

 

참조 자료형이 저장되는 특별한 데이터 보관함

참조 자료형의 데이터 자체는 지금까지 배웠던 원시 자료형이 보관되는 데이터 보관함이 아닌 특별한 데이터 보관함에 저장됩니다. 즉, 변수에는 특별한 데이터 보관함을 찾아갈 수 있는 주소가 담겨있고, 이 주소를 따라가 보면 특별한 데이터 보관함을 찾을 수 있는데, 이 특별한 데이터 보관함에서는 자기 마음대로 사이즈를 늘렸다가 줄였다가 합니다. ("동적(dynamic)으로 변한다"라고 하기도 합니다.) 이처럼 데이터는 별도로 관리되고, 우리가 직접 다루는 변수에는 주소가 저장되기 때문에 reference data type이라고 불립니다. 이런 특별한 데이터 보관함을 heap이라고도 부릅니다.

레퍼런스라는 단어는 컴퓨터 공학에서는 변수가 가리키고(refer) 있는 데이터의 참조한다는 의미로 사용됩니다. 평소에 코딩을 배울 때, 우리는 쉽게 변수의 정보를 읽는다고 이야기하지만, 컴퓨터 공학과 교수님은 종종 "참조"한다는 표현을 사용하시는데, 이 이유가 바로 여기에서 옵니다. 읽는 것이 아니라, 그 변수의 주소를 "참조"하여 실제 변수가 있는 장소에 어떤 데이터가 있는지 도착하고 나서야 비로소 "읽을 수" 있기 때문입니다.

 

 

특별한 데이터 보관함( heap )은, 왜 동적으로 크기가 변하게 되었을까요?

배열과 객체는 대량의 데이터를 쉽게 다루기 위해서 사용된다고 말씀드렸는데요. 쉽게 사용할 수 있는 이유는 크기가 고정되어 있지 않고 우리가 데이터를 추가하고 삭제하는 것에 따라서 크기가 달라지기 때문이라고 설명해 드렸습니다. 그렇기 때문에, 크기가 상황에 따라서 커졌다가 작아지는 특별한 데이터 저장소를 만들어 사용하기로 합의했습니다. 데이터가 언제 늘어나고 줄어들지 모르기 때문에 별도의 저장 공간을 마련하여 따로 관리하는 것입니다. 변수에는 원시 값 혹은 주소만 지정할 수 있고, 주소는 크기가 변하는 특별한 데이터 저장소를 참조하게 되는 것이죠.

 

---

+TIP

 

참조 자료형의 ===(strict equality)는 주소값이 같은지를 확인합니다. 그렇기 때문에 두 참조 자료형의 주소값은 다르다고 판단을 내릴 수 있습니다.

console.log([1,2,3] === [1,2,3]);

컴퓨터가 위 코드를 읽으면서, 이미 두 개의 heap 저장 공간의 주소를 확보했습니다. 다만 우리는 눈으로 확인하지 못할 뿐입니다. 배열([])과 객체({}) 등 참조 자료형을 읽을 때, 미리 주소값과 메모리 값을 잡아둔다고 생각하면 편합니다. 그러므로 [] === [] 도 true가 나오지 않는 것이죠.