如何递归过滤嵌套对象数组（基于 _id 字段移除任意层级的匹配项）

本文介绍一种通用的递归函数，用于从任意深度嵌套的对象数组中，根据 `_id` 值精准移除目标元素——无论该元素位于顶层、子级还是深层嵌套的 `assets` 等字段中，并保持其余结构完整。

在处理树形结构数据（如菜单、组织架构、资源资产列表）时，常需根据唯一标识（如 _id）动态剔除某节点，且该节点可能出现在任意嵌套层级。此时，简单的 filter() 无法覆盖深层子项，而硬编码遍历又缺乏可扩展性。下面提供一个健壮、可复用、语义清晰的递归解决方案。

✅ 核心思路

函数 removeIdFromArray 接收两个参数：待处理的数组 array 和待移除的 ID idToRemove。它逐层执行：

• 过滤顶层元素：若当前元素 _id 匹配，则直接排除（返回 false）；
• 递归处理子数组：若元素含有 assets（或其他自定义子字段），则对其递归调用自身，更新该字段为“已过滤后的新数组”；
• 保留非匹配项：未被移除的元素原样保留，确保结构完整性。

? 示例代码（支持任意子字段名）

function removeIdFromArray(array, idToRemove) {
  return array.filter((element) => {
    // 步骤1：若当前元素自身_id匹配，直接剔除
    if (element._id === idToRemove) {
      return false;
    }

    // 步骤2：递归处理预设的子字段（如 assets）
    // ✅ 可按需扩展：支持 assets、children、items 等多字段
    const childFields = ['assets', 'children', 'items'];
    childFields.forEach(field => {
      if (Array.isArray(element[field])) {
        element[field] = removeIdFromArray(element[field], idToRemove);
      }
    });

    // 步骤3：保留该元素（其子结构已递归净化）
    return true;
  });
}

// 测试数据
const arrayToBeFiltered = [
  { _id: "1", assets: [{ _id: "2" }, { _id: "3" }] },
  { _id: "4", assets: [{ _id: "5" }] }
];

console.log(JSON.stringify(removeIdFromArray(arrayToBeFiltered, "3"), null, 2));
// → 移除 _id="3" 的子项，保留其他所有结构

console.log(JSON.stringify(removeIdFromArray(arrayToBeFiltered, "4"), null, 2));
// → 移除 _id="4" 的顶层对象

⚠️ 注意事项与最佳实践

• 字段可配置性：示例中硬编码了 ['assets', 'children', 'items']，生产环境建议改为参数传入（如 childKeys = ['assets']），提升灵活性；
• 不可变性提醒：当前实现会修改原对象引用（如 element.assets = ...）。如需纯函数式/不可变操作，应使用结构克隆（如 structuredClone 或 Lodash cloneDeep）；
• 类型安全：函数假设所有 _id 字段为字符串。若存在数字 ID，请统一转换（如 String(element._id) === String(idToRemove)）；
• 性能考量：对超深或超大数组，可增加递归深度限制或改用栈模拟迭代，避免栈溢出。

✅ 总结

该递归过滤器以简洁逻辑实现了「跨层级精准剔除」，兼顾可读性与可维护性。只需微调子字段列表，即可适配各类嵌套 Schema，是前端处理树形数据的实用工具函数之一。