[Javascript] 객체 원시타입과 객체타입

두 개가 나눠진 이유는 두 개가 값이 저장되거나 복사되는 과정이 서로 다르기 때문

 

 

 

 

원시타입

 

값 자체로써 변수에 저장되거나 복사됨

 이 때 변수의 값이 수정되면 수정된 값을 메모리에 추가하고 변수에 저장되기 때문에

수정되기 전 값은 그대로 변하지 않고 존재 = 불변값

 

let a = 1;

일 때 실제 값인 1이 메모리에 저장되고 변수 a에 할당

 

a = 2;

이 때도 2가 메모리에 저장되고 변수에 할당되기 때문에
a가 변해도 실제 저장된 1,2 값은 수정되지 않음

 

 

 

객체타입

 

 객체타입은 값에 접근할 수 있는 주소값인 참조값을 통해 변수에 저장되고 복사됨
 객체타입은 메모리에 값이 저장되고 실제 변수에는 그 값을 갈 수 있는 참조값이 할당되어 저장

 

 

let a2 = { p: 1 };

일 때 실제 메모리에 {p:1} 저장되고

a2는 {p:1}에 갈 수 있는 주소 값이 할당

 

a2.p = 3;

으로 값이 변하면

객체 타입은 실제로 메모리에 저장된 {p:1} 같은 원본값이 {p:3}으로 수정 = 가변값

 

 

 

객체타입 주의사항

 

 

 

 1.의도치않게 값이 수정될 수 있음(side efffet)

 

     수정할 때는 spread 연산자를 이용해 해결 가능

    → 새로운 객체를 생성하면서 프로퍼티르 따로 복사하기 때문에 원본 객체는 수정 x

    let a3 = { p: 1 };
    let a4 = a3;
    let a5 = { ...a3 };

 

 

 

 

2. 객체 간의 비교는 기본적으로 참조값을 기준으로 이루어짐(얕은 비교)

 

   console.log(a3 === a4); 

     → 결괏값: true

   
  console.log(a3 === a5);

     → 결괏값: false

 

→ spread 연산자를 이용하면 실제 값은 같더라도 참조값이 다르기 때문에 ===사용하면 false 나옴

 

프로퍼티만을 이용해 비교하고 싶으면 JSON.stringfy() 객체를 문자열로 변환하는 기능인 내장함수 이용하면 됨

 

console.log(JSON.stringify(a3) === JSON.stringify(a5));

     → 결괏값: true

 

 

 

 

3. 배열과 함수도 사실 객체 → 추가적인  프로퍼티와 메서드 가질 수 있음