17.primitive, reference data type - ES6

---

Primitive data type

• 자바스크립트의 자료형 (문자, 숫자, array, object 등)은 자료형을 크게 2개로 분류합니다.

• Primitive data type들은 그냥 별건 없고 자료 자체가 변수에 저장되는 자료들입니다.

• string, number 자료형들이 대표적인 primitive data type들입니다.

const name = 'kim';
const age = 10;

• 이렇게 문자나 숫자 자료형은 문자나 숫자가 변수에 직접 저장된다는 것입니다.

Reference data type

• Array, Object 자료형은 reference data type에 속합니다.

reference data type은 자료를 변수에 직접 저장하는게 아닌,

• 자료가 저쪽에 있습니다 라는 화살표 (reference)를 변수에 저장합니다.

let person = {
  name: 'kim'
}

• { name : ‘Kim’ } 이라는 자료를 변수에 저장했습니다.

• 하지만 변수에 저장된건 { name : ‘Kim’ } 이게 아닙니다.

• “{ name : ‘Kim’ }이 저기 저장되어있습니다”라는

• { name : ‘Kim’ } 값을 가리키는 화살표가 저장이 되어있을 뿐입니다.

• 즉, Kim이라는게 저기 있습니다~ 라는 정보만 저장할 뿐입니다.

• 그래서 이런 reference만 저장되는 array, object 자료형을 reference data type이라고 합니다.

🔷 화살표가 가리키는 저기가 어디일까요?

• 컴퓨터 메모리 상의 어떤 곳입니다. 그냥 우리는 컨트롤할 수 없는 미지의 공간이라고 생각하셔도 됩니다.

• 어디서 이상한 C언어 배우다온 분들은 포인터인가? 라고 생각할 수 있는데 비슷합니다.

• 다만 C언어처럼 포인터 주소같은 개념은 다루지 못합니다.

• 아무튼 그래서 reference data type은 신기한 현상들이 일어납니다.

복사 할경우 일어나는 경우 (primitive vs reference data)

primitive data

let name1 = 'kim';
let name2 = name1;

name1 = 'park'

console.log(name1)
console.log(name2)

• name1 을 park 으로 변경했으니까 park 으로 나오고, name2 는 name1을 미리 복사 했기 때문에 kim 이 출력이 됩니다.

reference data

let person1 = {
  name: 'kim'
}
let person2 = person1 // 데이터 저장이 아닌 화살표가 저장이 되는것

person1.name = 'park'

console.log(person1.name)
console.log(person2.name)

• reference data type 은 data 값이 저장되는게 아니라 화살표 (reference) 가 저장을 되기 때문에 person1 의 가리키는 값이 바뀌면 자동으로 person2 에서도 바뀌게 되는것

• 그래서 array, object 를 함부로 복사하면 나중에 code 에서 error 가 많이 발생됨

reference data type 다루기

let person1 = {
  name: 'kim' // 저장된 값은 화살표 1
}
let person2 = {
  name: 'kim' // 저장된 값은 화살표 2
}

console.log(person1 === person2) // 다른 화살표를 가리키기 때문에 false 가 나옴

• 파라미터는 변수 생성 & 할당과 똑같습니다.

let person1 = {
  name: 'kim' // 저장된 값은 화살표 1
}

function tmp(obj) {
  obj.name = 'Park'
  console.log(person1) // 'park' 으로 바꿔서 출력됨
  obj = {name: 'Ko'} // obj 를 재할당 ko 로 해도 바뀌지 않음 왜냐면, name: ko 라는 것으로 할당하는 것이 아니라, 그것을 가리키는 화살표만 바뀌기 때문에 값은 변경이 되지 않음
  console.log(person1) 
}

tmp(person1)

🔶 🔷 📌 🔑

Reference

• poiemaweb - https://poiemaweb.com/js-data-type-variable