本文详解如何正确比较具有嵌套数组和对象的 json 数据，避免因引用相等性导致的误判，提供可复用的深度差异检测函数及生产级注意事项。
在 JavaScript 中，直接使用 === 或 == 比较对象或数组时，实际比较的是内存引用地址，而非结构与值是否一致。这意味着即使两个对象内容完全相同，只要它们是不同实例（例如两次 JSON.parse()、或两次字面量声明），比较结果仍为 false。这正是原问题中 imagens 和 lotes 被错误识别为“不同”的根本原因——它们是数组（引用类型），而原始函数未做深层值比对。
要实现按值比对（value-based comparison），必须递归或分层检查嵌套结构。以下是一个轻量、专注、可扩展的解决方案，特别针对含对象数组的场景：
✅ 核心思路
- 对基础类型（字符串、数字、布尔、null）直接使用 ===；
- 对数组：先校验长度与类型，再逐项比对每个元素（若元素为对象，则递归比对其属性）；
- 对普通对象（非数组）：本例暂不涉及深层嵌套对象比对，但已预留扩展接口；
- 其他引用类型（如 Date、Map、Set）需按需补充逻辑（后文说明）。
? 关键工具函数：isObjArrayValueEqual
function isObjArrayValueEqual(arr1, arr2) {
if (!Array.isArray(arr1) || !Array.isArray(arr2)) return false;
if (arr1.length !== arr2.length) return false;
for (let i = 0; i < arr1.length; i++) {
const a = arr1[i];
const b = arr2[i];
// 仅支持对象类型元素（忽略 null/undefined/原始值）
if (typeof a !== 'object' || typeof b !== 'object' || a === null || b === null) {
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 (!(key in b) || a[key] !== b[key]) return false;
}
}
return true;
}⚠️ 注意：此函数假设数组内所有元素均为扁平对象（无嵌套对象或数组）。若需支持任意深度嵌套，请升级为完整深比较（如 _.isEqual 或 fast-deep-equal）。
? 改进后的差异提取函数：getDiffKeys
const getDiffKeys = (newObj, oldObj) => {
// 空旧对象 → 全量更新
if (Object.keys(oldObj).length === 0 && Object.keys(newObj).length > 0) {
return Object.keys(newObj);
}
const diffKeys = [];
for (const key in oldObj) {
// 跳过原型链属性
if (!oldObj.hasOwnProperty(key)) continue;
const newVal = newObj[key];
const oldVal = oldObj[key];
// 值未变更 → 跳过
if (newVal === oldVal) continue;
// 数组：走自定义值比对
if (Array.isArray(newVal) && Array.isArray(oldVal)) {
if (!isObjArrayValueEqual(newVal, oldVal)) {
diffKeys.push(key);
}
continue;
}
// 其他类型（含 null、undefined、对象、日期等）默认按引用判断
// 若需更精确（如 Date 比对时间戳），此处可扩展
diffKeys.push(key);
}
return diffKeys;
};✅ 使用示例
const objA = { /* 原始对象 */ };
const objB = { ...objA, imagens: [{ extension: "jpeg", url: "...", extra: "field" }] };
console.log(getDiffKeys(objA, objB));
// → ["imagens"] （正确识别新增字段）
console.log(getDiffKeys(objA, objA));
// → [] （相同对象返回空数组，无误报）? 重要注意事项
- 性能权衡：深度比较必然带来开销。高频调用场景建议加缓存（如 JSON.stringify 哈希预计算）或采用不可变数据结构（如 Immutable.js）。
-
边界情况处理：
- null 与 undefined：null === undefined 为 false，符合预期；
- NaN：NaN !== NaN，需单独处理（本例未覆盖，生产环境建议用 Number.isNaN() 判断）；
- Date / RegExp：应转换为字符串或原始值再比对（例如 date.getTime()）。
-
推荐生产方案：对于复杂需求，优先选用成熟库：
npm install fast-deep-equal
import equal from 'fast-deep-equal'; if (!equal(oldObj[key], newObj[key])) diffKeys.push(key);
✅ 总结
精准提取对象差异键的关键，在于区分引用相等与值相等。本文提供的 isObjArrayValueEqual + getDiffKeys 组合，以最小侵入方式解决了嵌套数组的误判问题，兼顾可读性与实用性。开发者可根据业务复杂度，选择轻量自实现或引入专业深比较库，确保数据同步、表单校验、状态更新等场景的可靠性与可维护性。
