JavaScript中使用hasOwnProperty实现简单的对象深度对比实例教程

JavaScript 深度对比：hasOwnProperty 的能力与边界

在 JavaScript 中，判断两个对象是否相等是一个常见且棘手的问题。直接使用 hasOwnProperty 能解决吗？答案是否定的。它仅判断对象自身是否拥有某个属性——注意，是“自身”，不涉及原型链。然而，若要实现可靠的深度对比，hasOwnProperty 又是不可或缺的基础工具。关键在于将其与递归、类型判断等方法组合使用。

为何 hasOwnProperty 无法单独完成深度对比？

实际上，hasOwnProperty 的职责非常单一——它只回答“该键是否为对象自身定义的属性”。它不比较值、不递归、不处理数组或嵌套对象。举个典型反例：有两个结构完全相同的对象，但属性分别来自原型链，此时 hasOwnProperty 检查的结果可能一模一样，实际内容却相差甚远。因此，切勿指望它单打独斗就能完成深度对比。

hasOwnProperty 在深度对比中的核心作用：过滤继承属性

遍历对象时，for...in 会把原型链上的属性也一并捞出来——toString、valueOf 这些方法都会跑进来凑热闹。如果不加过滤直接对比，结果肯定错得一塌糊涂。这就是 hasOwnProperty 在深度对比中最核心的价值：

• 遍历对象所有键时，首先使用 obj.hasOwnProperty(key) 确认该键属于实例自身
• 将 for...in 默认包含的原型属性全部排除
• 防止因原型链污染或扩展导致的对比错误

简单来说，它就是个“守门员”，只放行自有属性。

一个实用的基础深度对比函数示例

以下实现轻量且可读性高，支持普通对象和原始值，其核心正是利用 hasOwnProperty 确保仅比较自有属性：

function deepEqual(a, b) {
  if (a === b) return true;
  if (a == null || b == null) return false;
  if (typeof a !== 'object' || typeof b !== 'object') return false;

  const keysA = Object.keys(a);
  const keysB = Object.keys(b);

  if (keysA.length !== keysB.length) return false;

  for (const key of keysA) {
    // 关键步骤：确保是自有属性，排除原型干扰
    if (!a.hasOwnProperty(key) || !b.hasOwnProperty(key)) continue;
    if (!deepEqual(a[key], b[key])) return false;
  }

  return true;
}

一个小细节：Object.keys() 默认只返回自有可枚举属性，已隐含 hasOwnProperty 的逻辑，因此上面的显式检查看似冗余。但为什么还要加上？一是为了让代码意图更加清晰，二是为了兼容 for...in 遍历场景——在这种情况下，缺少 hasOwnProperty 将导致错误。

更健壮的写法：兼容 for...in 场景

如果选择使用 for...in 遍历（例如需要兼容旧环境或特殊枚举控制），那么 hasOwnProperty 绝对不可省略：

for (let key in a) {
  if (!a.hasOwnProperty(key) || !b.hasOwnProperty(key)) continue;
  if (!deepEqual(a[key], b[key])) return false;
}

另外需注意：上述实现仅处理普通对象和原始值。若遇到数组、Date、RegExp 等特殊类型，它们会被当作普通对象递归处理，结果很可能不符合预期。在实际生产环境中，建议针对这些类型进行单独处理。