primitive, Reference

자바스크립트에는 원시 자료형(primitive data type)과
참조 자료형(reference data type)이 있다.

---

원시 자료형(primitive data type)

원시 자료형에는 아래의 종류가 속한다.

(객체가 아니면서 method를 갖지 않는 데이터)

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

원시 자료형은, 고정된 저장공간을 차지하는 데이터를 뜻한다.

각자의 값이 본인의 사물함을 갖고 있는 것이다.

그렇기에 호출을 하기 위해선 각자에 맞는 변수명을 호출 해줘야 한다.

let word = "a"
let num = 123

하나의 변수에 하나 밖에 담을 수 없었던 예전부터 사용되던

원시적인 데이터 타입

*Bigint: Number 원시 값이 안정적으로 나타낼 수 있는 최대치인 253 - 1보다 큰 정수를 표현할 수 있는 내장 객체

*Symbol: 클래스나 객체 형식(object type)의 내부에서만 접근할 수 있도록 전용(private) 객체 속성의 키(key)로 사용된다. 범용적이지 않다.

---

참조 자료형(reference data type)

원시 자료형이 아닌 모든 것이 여기 속한다.

• function
• object
• array

컴퓨터가 참조 자료형을 담을 수 없었던 때에는 ','쉼표, 탭 등으로 데이터를 구분했다.

그러나, 배열에 담을 수 있는 데이터에 한계가 있어,

데이터의 크기가 동적으로 변하는 특별한 데이터 보관함을 만들었다.

---

둘의 차이

원시자료형은 값 그 자체를 저장하고 복사해 주는 개념이지만,

참조자료형은 기본적으로 값 자체가 아닌 값이 있는 위치(heap) 주소를 저장한다.

  let num = 123;
  let msg = "hello";
  let arr = [1, 2, 3];
  let isOdd = true;
  원시 자료형의 데이터가 저장되는 공간 (stack)
     1 | num |   123				//원시 자료형
     2 | msg |   "hello"			//원시 자료형
     3 | arr |   heap의 12번부터 3개	 	//참조 자료형
     4 |isOdd|   true				//원시 자료형
  =====================================
  참조 자료형의 데이터가 저장되는 공간 (heap)
     10 ||   
     11 || 
     12 || 1
     13 || 2  
     14 || 3  

위와 같이 차이가 있다.

let num = 123;
let y = num;
y = 456;		//재할당을 해주어도
x = 123;		//값을 복사만 해줬기에 원본 차이x
//원시 자료형
let x = { foo: 3 };
let y = x;
y.foo = 2;		//값의 위치를 알기에 내부를 건드릴 경우
x.foo = 2;		//같은 위치를 관리하던 원본x도 변경
//참조 자료형

값을 저장하는 것과 값의 위치 정보를 저장하는 것은 차이가 있다.

let myArray = [2, 3, 4, 5];
let ourArray = myArray;		//myArray의 주소값 할당
ourArray[2] = 25;		//myArray와 같은 위치의 객체를 수정
ourArray = undefined;		//원시자료형 undefined 재할당
				//(객체와 연결 끊어짐)
myArray; 			//[2, 3, 25, 5]

참조 자료형은 주소를 할당해주기에 이런 상황이 가능하다.

let player = { score: 3 };	//1. 객체 선언
function doStuff(obj) { 	//2. 함수 선언
  obj.score = 2;		//4. obj<player>.score
    				//주소에 숫자 2 할당
}

doStuff(player);		//3. 함수 호출, 변수에 player 입력

player;				//{ score: 2 }

참조 자료형은 함수 등을 거칠 때 다른 조치를 더해주지 않으면 위와 같이 이용할 수 있다.

let score = 80;			//1. 변수 선언
function doStuff(value) {	//2. 함수 선언
  value = 90;			//4. value에 score의 값을 할당
}

doStuff(score)			//3. 함수 호출, 변수에 score 입력

score;				//80

원시 자료형은 값을 복사해주는 개념이기에 원본에는 전혀 변화가 없다.

이러한 특징과 더불어 참조 자료형은 비교상황에서도 차이가 난다.

console.log('codestates' === 'codestates');	//true
console.log(3.14 === 3.14);			//true
console.log([1,2,3] === [1,2,3]);		//false
console.log({ foo: 'bar' } === { foo: 'bar' });	//false

배열과 객체의 값이 같음에도 false가 나오는 이유는,

서로 모습만 같을 뿐 다른 존재이기 때문이다.

사람 사이에도 동명이인이 있듯 저들은 이름만 같을 뿐,

사는 곳은 서울과 제주도인 동명이인이라고 보면 된다.

따로 선언을 하지 않았더라도 참조 자료형의 형태를 띄는 것이 입력된다면,

그 즉시 입력된 참조 자료형만의 이름 없는 주소를 갖게 된다.

엄격한 비교는 값이 아닌 주소를 비교한다.