使用递归移除children数组为空的对象元素

问题场景 #

需要移除嵌套数据结构中所有children数组为空的对象，无论该对象处于嵌套层级的哪一层。例如示例数据中name为Tom的对象，因children为空需被移除；普通的filter方法仅能处理第一层数据，无法递归清理深层嵌套的空children节点。

示例数据 #

const allData = [
  {
    name: "Alice",
    children: [
      { name: "Tom", children: [] }, // 需要移除
      {
        name: "Charlie",
        children: [
          { name: "Dave", children: [{ name: "Eve", children: [] }] }
        ]
      }
    ]
  },
  { name: "Frank", children: [] } // 需要移除
];

仅处理第一层的无效尝试 #

// 只能过滤第一层的空children节点，深层的Tom无法被移除
const filtered = allData.filter(item => item.children.length > 0);
console.log(filtered);
// 输出中Alice的节点仍保留，但她的children里的Tom未被清理

递归实现方案 #

通过递归先处理子节点，再判断当前节点是否需要保留：

function removeEmptyChildrenNodes(data) {
  return data.filter(node => {
    // 递归处理当前节点的children数组，先清理深层的空节点
    if (node.children && Array.isArray(node.children)) {
      node.children = removeEmptyChildrenNodes(node.children);
    }
    // 仅保留children不为空的节点
    return node.children?.length > 0;
  });
}

// 测试使用
const cleanedData = removeEmptyChildrenNodes(allData);
console.log(cleanedData);

代码逻辑说明 #

1. 函数接收一个数组类型的数据源，返回过滤后的新数组
2. 遍历每个节点时，先递归处理该节点的children，确保深层的空children节点被先清理
3. 最后判断当前节点的children是否还有有效内容（长度大于0），仅保留符合条件的节点

这样无论嵌套层级有多深，所有children为空的对象都会被彻底移除。

内容的提问来源于stack exchange，提问作者ArthurJ