Javascript创建从平面对象嵌套的对象

Question

我想创建一个层次结构，以便我可以将数据传递给我用来生成组织结构图的插件。

对于我的组织结构图，我掌握了所有需要处理的数据，例如员工和他们的一些基本数据。

FirstName 
LastName 
EmployeeID 
ManagerEmployeeID 
Manager Name 

此数据存储在一个没有嵌套的数组或不同的层次，这就是我想实现一些的jQuery/JavaScript之间的连接。

我的目标是采取这个数组并嵌套它基于ManagerID和EmployeeID，所以我可以做一个树层次结构。

我无法改变数据如何提供给我，否则我会从数据库响应中嵌套它。

实施例的数据：

• Tom Jones 
    o Alice Wong 
    o Tommy J. 
• Billy Bob 
    o Rik A. 
    ♣ Bob Small 
    ♣ Small Jones 
    o Eric C. 

我的平坦数据例如：

{ 
     "FirstName": "Tom" 
     "LastName": "Jones" 
     "EmployeeID": "123" 
     "ManagerEmployeeID": "" 
     "Manager Name": "" 
    }, 
    { 
     "FirstName": "Alice" 
     "LastName": "Wong" 
     "EmployeeID": "456" 
     "ManagerEmployeeID": "123" 
     "Manager Name": "Tom Jones" 
    }, 
    { 
     "FirstName": "Tommy" 
     "LastName": "J." 
     "EmployeeID": "654" 
     "ManagerEmployeeID": "123" 
     "Manager Name": "Tom Jones" 
    }, 
    { 
     "FirstName": "Billy" 
     "LastName": "Bob" 
     "EmployeeID": "777" 
     "ManagerEmployeeID": "" 
     "Manager Name": "" 
    }, 
    { 
     "FirstName": "Rik" 
     "LastName": "A." 
     "EmployeeID": "622" 
     "ManagerEmployeeID": "777" 
     "Manager Name": "Billy Bob" 
    }, 
    { 
     "FirstName": "Bob" 
     "LastName": "Small" 
     "EmployeeID": "111" 
     "ManagerEmployeeID": "622" 
     "Manager Name": "Rik A." 
    }, 
    { 
     "FirstName": "Small" 
     "LastName": "Jones" 
     "EmployeeID": "098" 
     "ManagerEmployeeID": "622" 
     "Manager Name": "Rik A" 
    }, 
    { 
     "FirstName": "Eric" 
     "LastName": "C." 
     "EmployeeID": "222" 
     "ManagerEmployeeID": "777" 
     "Manager Name": "Billy Bob" 
    } 

实施例所需的输出：

{ 
    "FirstName": "Tom", 
    "LastName": "Jones", 
    "EmployeeID": "123", 
    "ManagerEmployeeID": "", 
    "Manager Name": "", 
    { 
     "FirstName": "Alice", 
     "LastName": "Wong", 
     "EmployeeID": "456", 
     "ManagerEmployeeID": "123", 
     "Manager Name": "Tom Jones", 

    }, 
    { 
     "FirstName": "Tommy", 
     "LastName": "J.", 
     "EmployeeID": "654", 
     "ManagerEmployeeID": "123", 
     "Manager Name": "Tom Jones", 

    }, 

}, 
{ 
    "FirstName": "Billy", 
    "LastName": "Bob", 
    "EmployeeID": "777", 
    "ManagerEmployeeID": "", 
    "Manager Name": "", 
    { 
     "FirstName": "Rik", 
     "LastName": "A.", 
     "EmployeeID": "622", 
     "ManagerEmployeeID": "777", 
     "Manager Name": "Billy Bob", 
     , 
     { 
      "FirstName": "Bob", 
      "LastName": "Small", 
      "EmployeeID": "111", 
      "ManagerEmployeeID": "622", 
      "Manager Name": "Rik A.", 

     }, 
     { 
      "FirstName": "Small", 
      "LastName": "Jones", 
      "EmployeeID": "098", 
      "ManagerEmployeeID": "622", 
      "Manager Name": "Rik A", 

     }, 

    }, 

}, 
{ 
    "FirstName": "Eric", 
    "LastName": "C.", 
    "EmployeeID": "222", 
    "ManagerEmployeeID": "777", 
    "Manager Name": "Billy Bob", 

} 

有没有什么最佳实践来实现这样的东西？如果我有能力在数据库级别这样做，我会的。但是，我只有一份数据清单，以及基于ID的经理和员工之间的关联。

Answer 1

您可以使用reduce()创建递归函数并返回所需的数据结构。

var data = [{"FirstName":"Tom","LastName":"Jones","EmployeeID":"123","ManagerEmployeeID":"","Manager Name":""},{"FirstName":"Alice","LastName":"Wong","EmployeeID":"456","ManagerEmployeeID":"123","Manager Name":"Tom Jones"},{"FirstName":"Tommy","LastName":"J.","EmployeeID":"654","ManagerEmployeeID":"123","Manager Name":"Tom Jones"},{"FirstName":"Billy","LastName":"Bob","EmployeeID":"777","ManagerEmployeeID":"","Manager Name":""},{"FirstName":"Rik","LastName":"A.","EmployeeID":"622","ManagerEmployeeID":"777","Manager Name":"Billy Bob"},{"FirstName":"Bob","LastName":"Small","EmployeeID":"111","ManagerEmployeeID":"622","Manager Name":"Rik A."},{"FirstName":"Small","LastName":"Jones","EmployeeID":"098","ManagerEmployeeID":"622","Manager Name":"Rik A"},{"FirstName":"Eric","LastName":"C.","EmployeeID":"222","ManagerEmployeeID":"777","Manager Name":"Billy Bob"}]; 
 

 
function makeTree(data, parentId) { 
 
    return data.reduce(function(r, e) { 
 
    if (e.ManagerEmployeeID == parentId) { 
 
     var employees = makeTree(data, e.EmployeeID); 
 
     if (employees.length) e.employees = employees 
 
     r.push(e) 
 
    } 
 
    return r; 
 
    }, []) 
 
} 
 

 
console.log(makeTree(data, ''))

Answer 2

所需的输出不是JavaScript的有效数据结构。你需要在该对象中的一些键指向“孩子”。对于解决方案 - 通常，您遍历整个对象保存ID作为对象中的键，其余为给定ID的值。例如

let tree = {} 
flat.forEach(function(item) { 
    item.children = []; 
    tree[item.id] = item // build whole tree 

    // in case it is ordered by parent, you can use 
    tree[item.parentId].children.push(item); 
}) 
// in case it is not ordered, you have to traverse the structure again 
flat.forEach(function(item) { 
    tree[item.parentId].children.push(item); 
}) 

Answer 3

你可以使用一个循环的方法，并检查父母，又名ManagerEmployeeID和孩子。

此提议也适用于未排序的数据，无需递归。

var data = [{ FirstName: "Tom", LastName: "Jones", EmployeeID: "123", ManagerEmployeeID: "", "Manager Name": "" }, { FirstName: "Alice", LastName: "Wong", EmployeeID: "456", ManagerEmployeeID: "123", "Manager Name": "Tom Jones" }, { FirstName: "Tommy", LastName: "J.", EmployeeID: "654", ManagerEmployeeID: "123", "Manager Name": "Tom Jones" }, { FirstName: "Billy", LastName: "Bob", EmployeeID: "777", ManagerEmployeeID: "", "Manager Name": "" }, { FirstName: "Rik", LastName: "A.", EmployeeID: "622", ManagerEmployeeID: "777", "Manager Name": "Billy Bob" }, { FirstName: "Bob", LastName: "Small", EmployeeID: "111", ManagerEmployeeID: "622", "Manager Name": "Rik A." }, { FirstName: "Small", LastName: "Jones", EmployeeID: "098", ManagerEmployeeID: "622", "Manager Name": "Rik A" }, { FirstName: "Eric", LastName: "C.", EmployeeID: "222", ManagerEmployeeID: "777", "Manager Name": "Billy Bob" }], 
 
    tree = function (data, root) { 
 
     var r = [], 
 
      o = {}; 
 

 
     data.forEach(function (a) { 
 
      a.children = o[a.EmployeeID] && o[a.EmployeeID].children; 
 
      o[a.EmployeeID] = a; 
 
      if (a.ManagerEmployeeID === root) { 
 
       r.push(a); 
 
      } else { 
 
       o[a.ManagerEmployeeID] = o[a.ManagerEmployeeID] || {}; 
 
       o[a.ManagerEmployeeID].children = o[a.ManagerEmployeeID].children || []; 
 
       o[a.ManagerEmployeeID].children.push(a); 
 
      } 
 
     }); 
 
     return r; 
 
    }(data, ''); 
 

 
console.log(tree);

.as-console-wrapper { max-height: 100% !important; top: 0; }

的问题是，你需要指定root，在这种情况下MgrQID: "5555"，其中"5555"是根值调用函数

tree = function (data, root) { 
    // code 
}(data, "5555"); 
//  ^^^^^^ 

var data = [{ QID: "1234", MgrQID: "5555", PositionTitle: "Manager, Systems Administration 3" }, { QID:"5678", MgrQID: "1234", PositionTitle: "Systems Administrator 3" }], 
 
    tree = function (data, root) { 
 
     var r = [], 
 
      o = {}; 
 

 
     data.forEach(function (a) { 
 
      a.children = o[a.QID] && o[a.QID].children; 
 
      o[a.QID] = a; 
 
      if (a.MgrQID === root) { 
 
       r.push(a); 
 
      } else { 
 
       o[a.MgrQID] = o[a.MgrQID] || {}; 
 
       o[a.MgrQID].children = o[a.MgrQID].children || []; 
 
       o[a.MgrQID].children.push(a); 
 
      } 
 
     }); 
 
     return r; 
 
    }(data, "5555"); 
 

 
console.log(tree);

.as-console-wrapper { max-height: 100% !important; top: 0; }