在JavaScript的世界里，对象是一个复杂而灵活的存在。它们可以包含各种属性和方法，甚至可以嵌套其他对象。然而，当我们想要判断两个对象是否“相等”时，事情就变得不那么简单了。今天，我想聊聊JavaScript中对象相等的那些事儿。
1. 引用相等：它们真的是同一个对象吗？
在JavaScript中，对象是通过引用存储的。这意味着，当你创建一个对象并将其赋值给一个变量时，这个变量实际上存储的是对象在内存中的地址，而不是对象本身。因此，判断两个对象是否“相等”的最简单方式就是检查它们是否指向同一个内存地址。
const obj1 = { a: 1 };
const obj2 = { a: 1 };
const obj3 = obj1;
console.log(obj1 === obj2); // false
console.log(obj1 === obj3); // true
在这个例子中，obj1和obj2虽然内容相同，但它们是两个不同的对象，存储在不同的内存地址中。而obj1和obj3则指向同一个对象，因此它们是相等的。
总结：如果你想判断两个变量是否指向同一个对象，使用 === 或 == 就足够了。
2. 值相等：它们的内容相同吗？
然而，很多时候我们关心的并不是两个对象是否是同一个引用，而是它们的内容是否相同。比如，我们可能有两个不同的对象，但它们的所有属性和值都完全一致。这种情况下，我们需要进行“值相等”的判断。
2.1 浅比较：只比较第一层
浅比较是一种简单的方式，它只比较对象的第一层属性。如果对象的属性值是基本类型（如数字、字符串、布尔值），浅比较可以很好地工作。
function shallowEqual(obj1, obj2) {
const keys1 = Object.keys(obj1);
const keys2 = Object.keys(obj2);
if (keys1.length !== keys2.length) {
return false;
}
for (let key of keys1) {
if (obj1[key] !== obj2[key]) {
return false;
}
}
return true;
}
const obj1 = { a: 1, b: 2 };
const obj2 = { a: 1, b: 2 };
const obj3 = { a: 1, b: 3 };
console.log(shallowEqual(obj1, obj2)); // true
console.log(shallowEqual(obj1, obj3)); // false
在这个例子中，obj1和obj2的内容相同，因此浅比较返回 true。而obj1和obj3的内容不同，浅比较返回 false。
注意：浅比较无法处理嵌套对象。如果对象的属性值仍然是对象，浅比较会失效。
2.2 深比较：递归比较所有层级
深比较是一种更复杂的方式，它会递归地比较对象的所有嵌套属性。这意味着，无论对象的结构有多复杂，深比较都能准确地判断它们的内容是否相同。
function deepEqual(obj1, obj2) {
if (obj1 === obj2) return true;
if (typeof obj1 !== 'object' || obj1 === null || typeof obj2 !== 'object' || obj2 === null) {
return false;
}
const keys1 = Object.keys(obj1);
const keys2 = Object.keys(obj2);
if (keys1.length !== keys2.length) {
return false;
}
for (let key of keys1) {
if (!keys2.includes(key) || !deepEqual(obj1[key], obj2[key])) {
return false;
}
}
return true;
}
const obj1 = { a: 1, b: { c: 2 } };
const obj2 = { a: 1, b: { c: 2 } };
const obj3 = { a: 1, b: { c: 3 } };
console.log(deepEqual(obj1, obj2)); // true
console.log(deepEqual(obj1, obj3)); // false
在这个例子中，obj1和obj2的内容完全相同，包括嵌套的对象 { c: 2 }，因此深比较返回 true。而obj1和obj3的嵌套对象不同，深比较返回 false。
总结：如果你需要比较复杂的对象，深比较是更可靠的选择。
3. 使用第三方库：让生活更简单
手动实现深比较可能会有些繁琐，尤其是在处理非常复杂的对象时。幸运的是，有一些优秀的第三方库可以帮助我们简化这个过程。比如，Lodash 提供了一个非常方便的 _.isEqual 方法。
const _ = require('lodash');
const obj1 = { a: 1, b: { c: 2 } };
const obj2 = { a: 1, b: { c: 2 } };
const obj3 = { a: 1, b: { c: 3 } };
console.log(_.isEqual(obj1, obj2)); // true
console.log(_.isEqual(obj1, obj3)); // false
使用 Lodash，我们只需要一行代码就能完成深比较，既方便又高效。
4. 总结
在JavaScript中，判断两个对象是否相等并不是一件简单的事情。我们需要根据具体的需求选择合适的比较方式：
-
引用相等：使用
===或==，适用于判断两个变量是否指向同一个对象。 - 值相等：手动实现浅比较或深比较，或者使用第三方库如 Lodash，适用于判断两个对象的内容是否相同。
无论是浅比较还是深比较，理解它们的原理和适用场景，都能帮助我们在开发中更加得心应手。希望这篇随笔能对你有所帮助，下次再遇到对象相等的问题时，不妨试试这些方法吧！
网友评论