얕은 비교 vs 깊은 비교

얕은 비교

• 숫자, 문자열 등 원시 자료형은 값을 비교

• 배열, 객체 등 참조 자료형은 값 혹은 속성을 비교하지 않고 참조되는 위치를 비교

  

  데이터 저장 순서
  

const num1 = 1;
const num2 = 1;

console.log(num1 === num2);
//true
const str = "a";
const str1 = "a";

console.log(str === str1);
//true
const obj1 = {
  a: 1,
  b: 2,
};

const obj2 = {
  a: 1,
  b: 2,
};

console.log(obj1 === obj2);
//false

const arr = [1, 2, 3];
const arr1 = [1, 2, 3];

console.log(arr === arr1);
//false

객체와 배열 등 참조 자료형은 Heep의 주소를 비교하는 것이기에 같은 값을 지닌

참조 자료형을 비교해도 false가 나온다

깊은 비교

객체의 경우에도 값으로 비교

• Object depth가 깊지 않은 경우: JSON.stringify() 사용

const obj1 = {
  a: 1,
  b: 2,
};

const obj2 = {
  a: 1,
  b: 2,
};

console.log(JSON.stringify(obj1) === JSON.stringify(obj2));
//true
const arr = [1, 2, 3];
const arr1 = [1, 2, 3];

console.log(JSON.stringify(arr) === JSON.stringify(arr1));
//true

• Object depth가 깊은 경우: ladash 라이브러리의 isEqual ()사용

import _ from "lodash";

const obj1 = {
  a: 1,
  b: 2,
};

const obj2 = {
  a: 1,
  b: 2,
};

console.log(_.isEqual(obj1, obj2));
//true
const arr = [1, 2, 3];
const arr1 = [1, 2, 3];

console.log(_.isEqual(arr, arr1));
//true