JavaScript中统计数组内各父ID的所有子元素总数

嘿，这个需求我之前处理过，核心就是要计算每个节点的所有嵌套层级的子元素总数（包括子、孙、曾孙等），而不只是直接子节点。下面给你一步步实现的思路和代码：

步骤1：构建节点映射与子节点列表 #

首先我们把原始数组转换成一个以Id为键的映射对象，同时给每个节点建立它的直接子节点列表，这样后续查找会非常高效：

const arr = [{ "Id": "1", "Parent": "1"}, { "Id": "2", "Parent": "1" }, { "Id": "3", "Parent": "2"}, { "Id": "4", "Parent": "3"}, { "Id": "5", "Parent": "4"}, { "Id": "6", "Parent": "2"}];

// 创建Id到节点的映射，同时维护每个节点的直接子节点列表
const nodeMap = arr.reduce((map, node) => {
  // 把当前节点存入映射
  map[node.Id] = node;
  // 确保父节点在映射中存在（防止父节点还没被遍历到）
  if (!map[node.Parent]) {
    map[node.Parent] = { Id: node.Parent, children: [] };
  }
  // 初始化父节点的children数组（如果还没有的话）
  if (!map[node.Parent].children) {
    map[node.Parent].children = [];
  }
  // 注意：跳过节点自身作为父节点的情况（比如Id=1的Parent是1）
  if (node.Id !== node.Parent) {
    map[node.Parent].children.push(node.Id);
  }
  return map;
}, {});

步骤2：计算节点的全层级后代数量 #

这里有两种实现方式：递归版（代码简洁）和迭代版（适合大数据量，避免栈溢出）

递归版（适合数据量不大的场景） #

// 递归计算某个节点的所有后代总数
function getDescendantCount(nodeId) {
  const node = nodeMap[nodeId];
  // 如果没有子节点，直接返回0
  if (!node || !node.children || node.children.length === 0) return 0;
  
  // 累加每个子节点的数量（1个） + 子节点的后代数量
  return node.children.reduce((total, childId) => {
    return total + 1 + getDescendantCount(childId);
  }, 0);
}

迭代版（适合大数据量，避免栈溢出） #

// 用栈实现迭代遍历，计算后代总数
function getDescendantCountIterative(nodeId) {
  const node = nodeMap[nodeId];
  if (!node || !node.children || node.children.length === 0) return 0;
  
  let count = 0;
  // 初始化栈，放入所有直接子节点
  const stack = [...node.children];
  
  while (stack.length > 0) {
    const childId = stack.pop();
    count++; // 计数当前子节点
    // 把当前子节点的所有子节点加入栈，继续遍历
    const childNode = nodeMap[childId];
    if (childNode && childNode.children) {
      stack.push(...childNode.children);
    }
  }
  
  return count;
}

步骤3：生成最终结果数组 #

调用上面的函数，给每个节点计算后代数量，生成你想要的结果格式：

// 生成结果数组（这里用递归版，迭代版直接替换函数名即可）
const result = arr.map(node => ({
  Id: node.Id,
  count: getDescendantCount(node.Id)
}));

console.log(result);
// 输出结果：
// [
//   { Id: '1', count: 5 },
//   { Id: '2', count: 4 },
//   { Id: '3', count: 2 },
//   { Id: '4', count: 1 },
//   { Id: '5', count: 0 },
//   { Id: '6', count: 0 }
// ]

这个结果完全符合你的需求：ID1的子元素总数是5（包含2、3、4、5、6），ID2是4（3、4、5、6），ID3是2（4、5），以此类推。

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