Lodash中实现深度对象比较时忽略数组顺序的方法

在实际开发中，我们经常需要比较两个对象是否"相等"，但有时这种比较需要忽略数组元素的顺序。本文将介绍如何基于Lodash库实现这种灵活的深度比较功能。

问题背景

Lodash提供的_.isEqual()方法虽然能进行深度比较，但它会严格比较数组元素的顺序。例如：

const obj1 = {'name': "piyush", marks: [100,20,33]};
const obj2 = {marks: [33,20,100], name: "piyush"};
console.log(_.isEqual(obj1, obj2)); // 输出false

虽然两个对象包含相同的键值对和数组元素，但由于数组顺序不同，_.isEqual()返回false。这在某些业务场景下可能不符合需求。

解决方案

我们可以通过扩展Lodash的功能来实现忽略数组顺序的深度比较。核心思路是：

1. 递归遍历对象的所有属性
2. 对遇到的每个数组进行排序
3. 然后使用_.isEqual()比较处理后的对象

实现代码

// 深度排序对象中的所有数组
function deepSortArrays(obj) {
  if (Array.isArray(obj)) {
    return _.sortBy(obj.map(deepSortArrays));
  } else if (_.isObject(obj)) {
    return _.mapValues(obj, deepSortArrays);
  } else {
    return obj;
  }
}

// 自定义深度比较函数
function deepEqual(obj1, obj2) {
  const sortedObj1 = deepSortArrays(obj1);
  const sortedObj2 = deepSortArrays(obj2);
  return _.isEqual(sortedObj1, sortedObj2);
}

使用示例

const obj1 = {
  name: "test",
  marks: [100, 20, 33],
  details: {
    scores: [5, 3, 8],
    info: {
      grades: [2, 1, 3]
    }
  }
};

const obj2 = {
  marks: [33, 20, 100],
  name: "test",
  details: {
    info: {
      grades: [3, 2, 1]
    },
    scores: [8, 5, 3]
  }
};

console.log(deepEqual(obj1, obj2)); // 输出true

实现原理

1. 递归处理：deepSortArrays函数会递归遍历对象的每个属性，确保处理到最深层的嵌套结构。

2. 数组排序：当遇到数组时，使用_.sortBy对数组元素进行排序。如果数组元素是对象，会继续递归处理。

3. 对象处理：对于普通对象，使用_.mapValues对每个属性值进行递归处理。

4. 最终比较：处理后的两个对象已经将所有数组排序，此时使用_.isEqual比较就能得到忽略顺序的结果。

注意事项

1. 此方法会修改原始对象的数组顺序，如果需要保留原对象，应该先进行深拷贝。

2. 对于包含不可排序元素（如对象）的数组，需要确保这些对象有稳定的排序依据。

3. 性能考虑：深度递归和排序操作对大型对象会有性能开销，应避免在频繁调用的场景使用。

扩展思考

这种忽略顺序的比较在以下场景特别有用：

• 测试断言中，当只关心数据内容不关心顺序时
• 配置比较，当配置项的顺序不影响功能时
• 数据一致性检查，如前后端数据对比

通过这种扩展，我们既利用了Lodash的强大功能，又满足了特定业务场景下的灵活需求。