Quartz 4

递归实现给每个对象打层级

4 min read

递归实现为每个对象打上层级标识（levelCode）

功能说明

该方法通过递归遍历树形结构数据，为每个对象添加 levelCode 字段，用以标识当前对象的层级。

核心代码

实现逻辑

/**
 * 为树形数据的每个对象添加层级标识 `levelCode`
 * @param {Array} data - 树形数据数组
 * @param {number} level - 当前层级（默认从 0 开始）
 * @returns {Array} - 添加了 `levelCode` 的数据
 */
function addLevelCode(data, level = 0) {
  data.forEach((item) => {
    // 添加层级标识
    item.levelCode = level;
 
    // 如果存在子节点，递归处理
    if (item.children) {
      addLevelCode(item.children, level + 1);
    }
  });
  return data; // 返回处理后的数据
}
 
// 示例数据
let data = [
  {
    id: "32432345",
    children: [
      {
        id: 111,
        children: []
      },
      {
        id: 22,
        children: []
      }
    ],
  },
  {
    id: "312",
    children: [
      {
        id: 114321,
        children: []
      },
      {
        id: 543,
        children: []
      }
    ],
  },
];
 
// 调用函数并输出结果
let result = addLevelCode(data);
console.log(result);

实现效果

处理后的数据结构示例：

[
  {
    id: "32432345",
    levelCode: 0,
    children: [
      {
        id: 111,
        levelCode: 1,
        children: []
      },
      {
        id: 22,
        levelCode: 1,
        children: []
      }
    ]
  },
  {
    id: "312",
    levelCode: 0,
    children: [
      {
        id: 114321,
        levelCode: 1,
        children: []
      },
      {
        id: 543,
        levelCode: 1,
        children: []
      }
    ]
  }
];

代码拆解与分析

1. 添加层级标识

item.levelCode = level;
  • 每个对象的层级标识 levelCode，由函数的 level 参数决定。
  • 初始层级为 0，每递归深入一层，level 加 1。

2. 递归处理子节点

if (item.children) {
  addLevelCode(item.children, level + 1);
}
  • 判断对象是否存在子节点（children 字段）。
  • 如果有子节点，则递归调用函数，为子节点继续添加 levelCode。

3. 返回结果

return data;
  • 函数返回处理后的数据，可以用于链式调用或直接使用。

关键点总结

  1. 递归结构清晰：

    • 函数通过 forEach 遍历每个节点，同时递归处理子节点，直至叶子节点。

  2. 动态层级计算：

    • 利用递归参数 level 动态传递当前层级信息，每深入一层，层级自动递增。

  3. 数据原地修改：

    • 该方法直接在输入数据对象上添加 levelCode 字段，不会创建新的数据副本。

适用场景

  1. 树形结构数据展示：

    • 前端页面中，需要根据层级标识（如缩进、样式等）展示嵌套数据。

  2. 层级分析：

    • 为树形数据添加层级信息，便于数据统计或逻辑处理。

  3. 递归算法的入门示例：

    • 展示递归算法在树形数据中的典型应用，代码结构清晰，逻辑易懂。

优化方向

  1. 提高代码鲁棒性：

    • 可增加对输入数据的合法性检查，确保数据结构符合要求（如 data 是数组，children 是可选属性等）。

  2. 非原地修改版本：

    • 如果需要保持原始数据不变，可采用深拷贝的方法，生成新的数据对象进行修改。

总结

本方法简洁高效，通过递归为树形结构数据添加层级标识，既满足了树形数据的层级展示需求，又为递归算法的学习提供了经典案例。

Graph View

Backlinks