[JavaScript] 자바스크립트 객체 비교 방법

객체 간 다른 요소 확인

npm i deep-object-diff

 

오류 발생시 --force(충돌 우회) 옵션이나 --legacy-peer-deps(충돌 무시) 옵션을 사용합니다.

 

import { diff } from "deep-object-diff";

const object1 = {"a": 1, "b": 2, "c": 3};
const object2 = {"a": 1, "b": 2, "c": 4};

console.log(diff(object1, object2));

 

로그 결과

 

두 가지 객체에서 다른 요소가 객체 형태로 반환됩니다.

 

 

두 객체가 같은지 확인

결국 diff(object1, object2) 의 결과가 {} (빈 객체) 로 나오면 두 객체가 서로 같다는 뜻이겠지요.

 

그런데 아시는 분은 아시겠지만 Javascript에서는

console.log({} === {});

라는 연산의 결과가 false입니다.

 

const obj = {};
console.log(Object.keys(obj).length === 0);

그래서 이런 방법으로 객체의 키를 리스트로 받은 뒤 그 크기가 0일 때 같다고 판단합니다.

 

다른 방법으로

npm i lodash

npm i --save-dev @types/lodash    // 타입스크립트 이용시 이것도 설치

import {cloneDeep, isEqual} from "lodash";

console.log(isEqual(object1, object2));

lodash 라이브러리의 isEqual을 이용하여 비교할 수도 있습니다.