소개
이 랩에서는 JavaScript 에서 객체 동일성 (object equality) 의 개념을 탐구합니다. 두 값이 동일한지 여부를 결정하기 위해 다양한 기술을 사용하여 두 값 간의 심층 비교 (deep comparison) 를 수행하는 방법을 배우겠습니다. 예를 들어, 값이 동일한지 확인하고, 동일한 값을 가진 비 객체 값인지 확인하며, Object.keys()를 사용하여 두 값 모두 동일한 수의 키를 가지고 있는지 확인하는 방법 등이 있습니다. 또한 재귀 (recursion) 를 사용하여 중첩된 객체를 비교하는 방법도 이해할 것입니다.
JavaScript 에서 객체 동일성 확인 방법
두 값이 동일한지 확인하려면 다음 단계를 따르세요.
- 터미널/SSH 를 열고
node를 입력하여 코딩 연습을 시작합니다. equals()함수를 사용하여 두 값 간의 심층 비교 (deep comparison) 를 수행합니다.- 두 값이 동일한지 확인합니다. 그렇다면
true를 반환합니다. Date.prototype.getTime()을 사용하여 두 값이 동일한 시간을 가진Date객체인지 확인합니다. 그렇다면true를 반환합니다.- 두 값이 동일한 값을 가진 비 객체 값 (strict comparison) 인지 확인합니다. 그렇다면
true를 반환합니다. - 값 중 하나만
null또는undefined이거나 프로토타입이 다른지 확인합니다. 그렇다면false를 반환합니다. - 위의 조건 중 어느 것도 충족되지 않으면
Object.keys()를 사용하여 두 값 모두 동일한 수의 키를 가지고 있는지 확인합니다. Array.prototype.every()를 사용하여a의 모든 키가b에 존재하고equals()를 재귀적으로 호출하여 동일한지 확인합니다.
equals() 함수를 구현하려면 다음 코드를 사용하세요.
const equals = (a, b) => {
if (a === b) return true;
if (a instanceof Date && b instanceof Date)
return a.getTime() === b.getTime();
if (!a || !b || (typeof a !== "object" && typeof b !== "object"))
return a === b;
if (a.prototype !== b.prototype) return false;
const keys = Object.keys(a);
if (keys.length !== Object.keys(b).length) return false;
return keys.every((k) => equals(a[k], b[k]));
};
equals() 함수를 테스트하려면 다음 코드 예제를 사용하세요.
equals(
{ a: [2, { e: 3 }], b: [4], c: "foo" },
{ a: [2, { e: 3 }], b: [4], c: "foo" }
); // true
equals([1, 2, 3], { 0: 1, 1: 2, 2: 3 }); // true
요약
축하합니다! 객체 동일성 확인 랩을 완료했습니다. LabEx 에서 더 많은 랩을 연습하여 기술을 향상시킬 수 있습니다.