深层层次数据树

问题描述 投票:0回答:1

我有一个对象数组,其中有一些属性,例如

fullName
reportingTo
,然后我有另一个属于 ceo 的对象,最终的数据结构是每个对象现在都有一个
fullName
(如果有的话)其他对象,如果
reportingTo
与它们的名称匹配,则该对象必须从数组中删除并添加到孩子属性中,我只能在几个级别上做到这一点,但我需要它动态,所以即使有 100 个父母它也必须工作,我将数据放在下面以及到目前为止我能做什么



let data = [
  {
    department: "development",
    designation: "lead",
    employeeId: "2",
    fullName: "Kashif",
    reportingTo: "Rashid",
    workEmail: "[email protected]",
    workPhone: "2222222222",
  },

  {
    department: "development",
    designation: "UI Developer",
    employeeId: "3",
    fullName: "Sharif",
    reportingTo: "Rashid",
    workEmail: "[email protected]",
    workPhone: "3333333333",
  },
  {
    department: "development",
    designation: "UX Developer",
    employeeId: "4",
    fullName: "Naveen",
    reportingTo: "Rashid",
    workEmail: "[email protected]",
    workPhone: "4444444444",
  },
  {
    department: "development",
    designation: "Developer",
    employeeId: "5",
    fullName: "Mani",
    reportingTo: "Kiran",
    workEmail: "[email protected]",
    workPhone: "5555555555",
  },

  {
    department: "development",
    designation: "Developer",
    employeeId: "6",
    fullName: "Joseph",
    reportingTo: "kiran",
    workEmail: "[email protected]",
    workPhone: "6666666666",
  },
  {
    department: "development",
    designation: "Developer",
    employeeId: "7",
    fullName: "Waseem",
    reportingTo: "Mani",
    workEmail: "[email protected]",
    workPhone: "6666666666",
  },
  {
    department: "development",
    designation: "Developer",
    employeeId: "8",
    fullName: "Munir",
    reportingTo: "Waseem",
    workEmail: "[email protected]",
    workPhone: "6666666666",
  },
  {
    department: "development",
    designation: "Developer",
    employeeId: "9",
    fullName: "Maaz",
    reportingTo: "Munir",
    workEmail: "[email protected]",
    workPhone: "6666666666",
  },
  {
    department: "development",
    designation: "Developer",
    employeeId: "10",
    fullName: "Hazma",
    reportingTo: "Maaz",
    workEmail: "[email protected]",
    workPhone: "6666666666",
  },
  {
    department: "development",
    designation: "Developer",
    employeeId: "11",
    fullName: "Muhammad",
    reportingTo: "Maaz",
    workEmail: "[email protected]",
    workPhone: "6666666666",
  },
  {
    department: "development",
    designation: "Developer",
    employeeId: "11",
    fullName: "Kiran",
    reportingTo: "Rashid",
    workEmail: "[email protected]",
    workPhone: "6666666666",
  },
];

let ceo = {
  department: "management",
  designation: "ceo",
  employeeId: "1",
  fullName: "Rashid",
  reportingTo: "null",
  workEmail: "[email protected]",
  workPhone: "1111111111",
};


const renderChildren = (list, reportingTo) => {
  let array = [];
  let dataArray = [...list];

  dataArray.map((item, i) => {
    if (item.reportingTo == reportingTo) {
      array.push(item);
      list.splice(i, 1);
    }
  });
  return array;
};

let ceoChildren = renderChildren(data, "Rashid"); // In this case we are getting all the employees who are reporting to ceo whose name is Rashid

预期结果应该是

let data = {
  department: "management",
  designation: "ceo",
  employeeId: "1",
  fullName: "Rashid",
  reportingTo: "null",
  workEmail: "[email protected]",
  workPhone: "1111111111",
  children: [
    {
      department: "development",
      designation: "lead",
      employeeId: "2",
      fullName: "Kashif",
      reportingTo: "Rashid",
      workEmail: "[email protected]",
      workPhone: "2222222222",
    },
    {
      department: "development",
      designation: "Developer",
      employeeId: "11",
      fullName: "Kiran",
      reportingTo: "Rashid",
      workEmail: "[email protected]",
      workPhone: "6666666666",
      children: [
        {
          department: "development",
          designation: "Developer",
          employeeId: "5",
          fullName: "Mani",
          reportingTo: "Kiran",
          workEmail: "[email protected]",
          workPhone: "5555555555",
          children: [
            {
              department: "development",
              designation: "Developer",
              employeeId: "7",
              fullName: "Waseem",
              reportingTo: "Mani",
              workEmail: "[email protected]",
              workPhone: "6666666666",
              children: [
                {
                  department: "development",
                  designation: "Developer",
                  employeeId: "8",
                  fullName: "Munir",
                  reportingTo: "Waseem",
                  workEmail: "[email protected]",
                  workPhone: "6666666666",
                  children: [
                    {
                      department: "development",
                      designation: "Developer",
                      employeeId: "9",
                      fullName: "Maaz",
                      reportingTo: "Munir",
                      workEmail: "[email protected]",
                      workPhone: "6666666666",
                      children: [
                        {
                          department: "development",
                          designation: "Developer",
                          employeeId: "10",
                          fullName: "Hazma",
                          reportingTo: "Maaz",
                          workEmail: "[email protected]",
                          workPhone: "6666666666",
                        },
                        {
                          department: "development",
                          designation: "Developer",
                          employeeId: "11",
                          fullName: "Muhammad",
                          reportingTo: "Maaz",
                          workEmail: "[email protected]",
                          workPhone: "6666666666",
                        },
                      ],
                    },
                  ],
                },
              ],
            },
          ],
        },

        {
          department: "development",
          designation: "Developer",
          employeeId: "6",
          fullName: "Joseph",
          reportingTo: "Kiran",
          workEmail: "[email protected]",
          workPhone: "6666666666",
        },
      ],
    },
    {
      department: "development",
      designation: "UI Developer",
      employeeId: "3",
      fullName: "Sharif",
      reportingTo: "Rashid",
      workEmail: "[email protected]",
      workPhone: "3333333333",
    },
    {
      department: "development",
      designation: "UX Developer",
      employeeId: "4",
      fullName: "Naveen",
      reportingTo: "Rashid",
      workEmail: "[email protected]",
      workPhone: "4444444444",
    },
  ],
};


javascript arrays tree hierarchy
1个回答
0
投票

您可以创建一个普通对象(如字典),由名称作为键,每个键都有与该名称相关的对象作为对应值。

然后使用

fullName
reportingTo
对使用为这些名称找到的对象来填充
children
数组。

最后,返回一个对象,该对象同时具有根列表和用于按名称查找节点的字典。

这是一个实现:

function createTree(data) {
    const nodes = Object.fromEntries(data.map(o => [o.fullName, o]));
    const roots = [];
    nodes.null = { children: roots };
    for (let {fullName, reportingTo} of data) {
        (nodes[reportingTo].children ??= []).push(nodes[fullName]);
    }
    return {nodes,roots};
}

const data = [{department: "development",designation: "lead",employeeId: "2",fullName: "Kashif",reportingTo: "Rashid",workEmail: "[email protected]",workPhone: "2222222222",},{department: "development",designation: "UI Developer",employeeId: "3",fullName: "Sharif",reportingTo: "Rashid",workEmail: "[email protected]",workPhone: "3333333333",},{department: "development",designation: "UX Developer",employeeId: "4",fullName: "Naveen",reportingTo: "Rashid",workEmail: "[email protected]",workPhone: "4444444444",},{department: "development",designation: "Developer",employeeId: "5",fullName: "Mani",reportingTo: "Kiran",workEmail: "[email protected]",workPhone: "5555555555",},{department: "development",designation: "Developer",employeeId: "6",fullName: "Joseph",reportingTo: "Kiran",workEmail: "[email protected]",workPhone: "6666666666",},{department: "development",designation: "Developer",employeeId: "7",fullName: "Waseem",reportingTo: "Mani",workEmail: "[email protected]",workPhone: "6666666666",},{department: "development",designation: "Developer",employeeId: "8",fullName: "Munir",reportingTo: "Waseem",workEmail: "[email protected]",workPhone: "6666666666",},{department: "development",designation: "Developer",employeeId: "9",fullName: "Maaz",reportingTo: "Munir",workEmail: "[email protected]",workPhone: "6666666666",},{department: "development",designation: "Developer",employeeId: "10",fullName: "Hazma",reportingTo: "Maaz",workEmail: "[email protected]",workPhone: "6666666666",},{department: "development",designation: "Developer",employeeId: "11",fullName: "Muhammad",reportingTo: "Maaz",workEmail: "[email protected]",workPhone: "6666666666",},{department: "development",designation: "Developer",employeeId: "11",fullName: "Kiran",reportingTo: "Rashid",workEmail: "[email protected]",workPhone: "6666666666",},];
const ceo = {department: "management",designation: "ceo",employeeId: "1",fullName: "Rashid",reportingTo: "null",workEmail: "[email protected]",workPhone: "1111111111",};

// Initialise tree -- no need to distinguish the ceo; could be in same array
const tree = createTree(data.concat(ceo));
// Perform access in tree by name:
const ceoChildren = tree.nodes["Rashid"];
console.log(ceoChildren);
// Or by root:
const root = tree.roots[0];
console.log(root === ceoChildren); // true

© www.soinside.com 2019 - 2024. All rights reserved.