JS对象数组没有唯一ID时怎么深度去重

技术讲解 JavaScript进阶 适用场景：数据分析 / 表单合并 / 多维过滤配置

/**
 * 递归将对象的属性键按字典序排序，生成确定性规范化对象
 * @param {*} value 待规整的数据
 * @returns {*} 排序规整后的数据副本
 */
function canonicalize(value) {
  // 1. 处理 null 与非对象基本类型
  if (value === null || typeof value !== 'object') {
    return value;
  }

  // 2. 处理 Date 与 RegExp 等特殊内置对象（按需保留自身值）
  if (value instanceof Date) {
    return value.toISOString();
  }
  if (value instanceof RegExp) {
    return value.toString();
  }

  // 3. 处理数组：保持原始下标顺序，递归规整数组项
  if (Array.isArray(value)) {
    return value.map(canonicalize);
  }

  // 4. 处理纯对象：提取所有自身可枚举键并字典序排序
  const sortedKeys = Object.keys(value).sort();
  const sortedObj = {};
  for (const key of sortedKeys) {
    sortedObj[key] = canonicalize(value[key]);
  }

  return sortedObj;
}

/**
 * 对象数组无ID深度去重（规范化键排序法）
 * @template T
 * @param {T[]} array 待去重的对象数组
 * @returns {T[]} 去重后的纯净数组（保留首项引用）
 */
function dedupeByCanonicalSort(array) {
  if (!Array.isArray(array) || array.length <= 1) {
    return Array.isArray(array) ? [...array] : [];
  }

  const seen = new Set();
  const result = [];

  for (let i = 0; i < array.length; i++) {
    const item = array[i];
    // 生成排序后的确定性 JSON 指纹
    const canonicalItem = canonicalize(item);
    const fingerprint = JSON.stringify(canonicalItem);

    if (!seen.has(fingerprint)) {
      seen.add(fingerprint);
      result.push(item); // 严谨保留原对象引用
    }
  }

  return result;
}

// 构造测试数据：对象顺序颠倒、嵌套子对象、数组字段
const testList = [
  { name: 'Filter_A', params: { min: 10, max: 100 }, tags: ['js', 'web'] },
  { params: { max: 100, min: 10 }, name: 'Filter_A', tags: ['js', 'web'] }, // 重复项（键乱序）
  { name: 'Filter_B', params: { min: 10, max: 100 }, tags: ['js', 'web'] }, // 异质项
  { name: 'Filter_A', params: { min: 10, max: 100 }, tags: ['web', 'js'] }, // 数组顺序不同，判定为相异
  { params: { min: 10, max: 100 }, tags: ['js', 'web'], name: 'Filter_A' }  // 重复项
];

const cleaned = dedupeByCanonicalSort(testList);

console.log('原始长度:', testList.length); // 示例输出：5
console.log('去重后长度:', cleaned.length); // 示例输出：3
console.log(JSON.stringify(cleaned, null, 2));

注意事项：在数组字段比对中，['js', 'web'] 与 ['web', 'js'] 通常被判定为不同数据，因为数组是有序列表（Index-based sequence）。如果业务要求数组内容无序相等，需要在 canonicalize 中额外对特定字段的数组执行排序。

/**
 * 递归判断两个任意类型变量是否深度全等
 * @param {*} a 比较对象A
 * @param {*} b 比较对象B
 * @returns {boolean} 是否深度相等
 */
function deepEqual(a, b) {
  // 1. 快速通道：引用相同或基础类型相同（支持 Object.is 对 NaN 的精确判定）
  if (Object.is(a, b)) return true;

  // 2. 拦截 null、基础类型及类型不同场景
  if (typeof a !== 'object' || a === null || typeof b !== 'object' || b === null) {
    return false;
  }

  // 3. 构造函数 / 原型差异拦截
  if (a.constructor !== b.constructor) return false;

  // 4. 特殊内置对象处理
  if (a instanceof Date) {
    return a.getTime() === b.getTime();
  }
  if (a instanceof RegExp) {
    return a.toString() === b.toString();
  }

  // 5. 数组比对
  if (Array.isArray(a)) {
    if (a.length !== b.length) return false;
    for (let i = 0; i < a.length; i++) {
      if (!deepEqual(a[i], b[i])) return false;
    }
    return true;
  }

  // 6. 普通对象比对
  const keysA = Object.keys(a);
  const keysB = Object.keys(b);

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

  for (let i = 0; i < keysA.length; i++) {
    const key = keysA[i];
    // 确保键名存在于 b 中，并且属性值递归深度相等
    if (!Object.prototype.hasOwnProperty.call(b, key)) return false;
    if (!deepEqual(a[key], b[key])) return false;
  }

  return true;
}

/**
 * 基于 deepEqual 的数组深度去重
 * @template T
 * @param {T[]} array 待去重数组
 * @returns {T[]} 去重后结果
 */
function dedupeByDeepEqual(array) {
  if (!Array.isArray(array) || array.length <= 1) {
    return Array.isArray(array) ? [...array] : [];
  }

  return array.filter((item, index, self) => {
    // 查找当前项在数组中首次出现的匹配索引
    const firstIndex = self.findIndex(other => deepEqual(item, other));
    return firstIndex === index;
  });
}

性能建议：在千万级前端交互中，永远不要在 Array.prototype.filter 中嵌套调用未做哈希缓存的 deepEqual。一旦数组长度超过 500，必须优先采用规范化键排序序列化法，通过一次性构建索引哈希集合实现极速判重。