객체끼리 값 비교하기

object(객체)는 참조형이기 때문에 key, value 값 및 순서가 같은 object를 일치 연산자(===)로 비교할 수 없다.

즉, 참조형을 원시형으로 바꾸어서 비교해주어야 한다!

 

1. key 순서가 정해진 객체 비교

const one = {
  name: "wooyoung",
  age: 34,
}
const two = {
  name: "wooyoung",
  age: 34,
}

// 1. Using JSON
JSON.stringify(one) === JSON.stringify(two); // true
console.log(JSON.stringify(one)); // '{"name":"wooyoung","age":34}'

// 2. Using Object.entries
Object.entries(one).toString() === Object.entries(two).toString(); // true
console.log(Object.entries(one)) // [ ['name','wooyoung'], ['age', 34] ]
console.log(Object.entries(one).toString()) // 'name,wooyoung,age,34'

 

2. key 순서가 정해지지 않은 객체 비교

만일 순서가 정해진 객체가 아닌, 객체의 key 순서를 보장하지 않을 경우 위의 비교식으로는 불가능하다.

 

대표적으로 서버의 데이터베이스의 값들을 객체화 할때 발생하는 경우이다.

예를 들어 서버로부터 객체를 받아오는데 그때마다 {name: "wooyoung", age: 34} 로 들어올 때도 있고

{age: 34, name: "wooyoung"} 로 들어오기도 해서 제대로 된 비교를 하기 위해 아래와 같은 하드 코드를 작성한다.

/* 1. 객체의 key값을 sort 정렬
   2. 정렬된 key를 reduce로 순회하면서 key value를 첫 {} 안에 순서대로 입력 */
let one_sort = Object.keys(one).sort().reduce((obj, key) => (obj[key] = one[key], obj), {});
let two_sort = Object.keys(two).sort().reduce((obj, key) => (obj[key] = two[key], obj), {});

console.log(one_sort); // { "name":"wooyoung", "age": 34 }
console.log(two_sort); // { "name":"wooyoung", "age": 34 }

console.log(JSON.stringify(one_sort) === JSON.stringify(two_sort)); // true
console.log(Object.entries(one_sort).toString() === Object.entries(two_sort).toString()); // true

 

 

[참조 URL]

https://inpa.tistory.com/entry/JS-%F0%9F%9A%80-%EA%B0%9D%EC%B2%B4-%EB%81%BC%EB%A6%AC-%EA%B0%92-%EB%B9%84%EA%B5%90