繁体   English   中英

从更扁平的数组创建树结构数组

[英]Create tree structure array from flatter array

我有一个像这样更平坦的阵列

const arr = 
  [ { org_level_code: 'BBI',   org_level_name: 'Bostwick',     org_level_parent_code: 'toplevel',      children: null } 
  , { org_level_code: 'CDI',   org_level_name: 'BBi US',       org_level_parent_code: 'BBI',           children: null } 
  , { org_level_code: '60',    org_level_name: '60 - Sidney1', org_level_parent_code: 'BBI/CDI',       children: null } 
  , { org_level_code: 'BBC',   org_level_name: 'BBi Canada',   org_level_parent_code: 'BBI/CDI',       children: null } 
  , { org_level_code: 'BBI-2', org_level_name: 'BBi U.S. ',    org_level_parent_code: 'BBI/CDI',       children: null } 
  , { org_level_code: 'DEPT',  org_level_name: 'Dept',         org_level_parent_code: 'BBI/CDI/BBI-2', children: null } 
  ]

从这个数组我需要这样的数组

const data = 
  [ { org_level_code: 'BBI',              org_level_name: 'Bostwick',   org_level_parent_code: 'toplevel',     children: 
      [ { org_level_code: 'CDI',          org_level_name: 'BBi US',     org_level_parent_code: 'BBI',          children: 
          [ { org_level_code: 'BBC',      org_level_name: 'BBi Canada', org_level_parent_code: 'BBI/CDI',       children: null } 
          , { org_level_code: '60',    org_level_name: '60 - Sidney1',  org_level_parent_code: 'BBI/CDI',       children: null } 
          , { org_level_code: 'BBI-2',    org_level_name: 'BBi U.S. ',  org_level_parent_code: 'BBI/CDI',      children: 
              [ { org_level_code: 'DEPT', org_level_name: 'Dept',       org_level_parent_code: 'BBI/CDI/BBI-2', children: null }
  ] } ] } ] } ] 

正如您在示例"org_level_parent_code": "toplevel"是父节点, "org_level_parent_code": "BBI"是父节点的第二个节点,因为第一个节点与子节点有"org_level_code": "BBI""org_level_parent_code": "BBI/CDI"表示第三级 这些斜线分隔的字符串与它们各自的父节点有关系。

最后一个字符串,例如斜线分隔字符串的BBI-2与上述节点有关系。

注意 - 顶级节点可以是多个,例如 " org_level_parent_code "org_level_parent_code": "toplevel"

我真的很难做到这一点。 请帮忙。

您可以使用Map来存储节点位置,如果下一个节点找到父节点,则推送到该父节点。

 const arr = [{ "org_level_code": "BBI", "org_level_name": "Bostwick", "org_level_parent_code": "toplevel", "children": null }, { "org_level_code": "BBI", "org_level_name": "BBi US", "org_level_parent_code": "BBI", "children": null }, { "org_level_code": "60", "org_level_name": "60 - Sidney1", "org_level_parent_code": "BBI/BBI", "children": null }, { "org_level_code": "BBC", "org_level_name": "BBi Canada", "org_level_parent_code": "BBI/BBI", "children": null }, { "org_level_code": "BBI-2", "org_level_name": "BBi US ", "org_level_parent_code": "BBI/BBI", "children": null }, { "org_level_code": "DEPT", "org_level_name": "Dept", "org_level_parent_code": "BBI/BBI/BBI-2", "children": null }]; let map = new Map; let result = arr.shift(); for (const item of arr) { item.children??= [] let parentId = item.org_level_parent_code; map.set(parentId + "/" + item.org_level_code, item); map.get(parentId)?.children.push(item); } result.children = [map.get("BBI/BBI")]; console.log(result);

我们可以根据级别添加节点。 以下是解决方案:-

const orgGreenTree = (array) => {
let levels = [{}];
array.forEach(function(a) {
  let level;
  if (a.org_level_parent_code === 'toplevel') {
    level = 0;
  }
  else {
    level = (a.org_level_parent_code.match(/\//g) || []).length + 1;
  }
  levels.length = level + 1;
  // console.log(level)
  levels[level].children = levels[level].children || [];
  levels[level].children.push(a);
  levels[level + 1] = a;
});
 return levels[0].children;
};
console.log(orgGreenTree(array));

这是使用Array#reduce()的简洁、更通用的解决方案。

它累积到 Object 中,其属性是每个项目的children数组的路径。 顶层项目被累积到toplevel子数组中,这是最终的结果。

 const arr = [{ org_level_code: 'BBI', org_level_name: 'Bostwick', org_level_parent_code: 'toplevel', children: null }, { org_level_code: 'CDI', org_level_name: 'BBi US', org_level_parent_code: 'BBI', children: null }, { org_level_code: '60', org_level_name: '60 - Sidney1', org_level_parent_code: 'BBI/CDI', children: null }, { org_level_code: 'BBC', org_level_name: 'BBi Canada', org_level_parent_code: 'BBI/CDI', children: null }, { org_level_code: 'BBI-2', org_level_name: 'BBi US ', org_level_parent_code: 'BBI/CDI', children: null }, { org_level_code: 'DEPT', org_level_name: 'Dept', org_level_parent_code: 'BBI/CDI/BBI-2', children: null }], result = arr.reduce((acc, item) => { const parentCode = item.org_level_parent_code; const childrenPath = `${parentCode === 'toplevel'? '': parentCode + '/'}${item.org_level_code}`; acc[childrenPath]??= []; (acc[parentCode]??= []).push({...item, children: acc[childrenPath] }) return acc; }, {}).toplevel console.log(JSON.stringify(result, null, 2));
 .as-console-wrapper { max-height: 100%;important: top; 0; }

此解决方案不依赖于输入数组的顺序,即使尚未遇到父项,也会正确累积子项。

 const arr = [ { org_level_code: 'DEPT', org_level_name: 'Dept', org_level_parent_code: 'BBI/CDI/BBI-2', children: null }, { org_level_code: 'CDI', org_level_name: 'BBi US', org_level_parent_code: 'BBI', children: null }, { org_level_code: '60', org_level_name: '60 - Sidney1', org_level_parent_code: 'BBI/CDI', children: null }, { org_level_code: 'BBI', org_level_name: 'Bostwick', org_level_parent_code: 'toplevel', children: null }, { org_level_code: 'BBC', org_level_name: 'BBi Canada', org_level_parent_code: 'BBI/CDI', children: null }, { org_level_code: 'BBI-2', org_level_name: 'BBi US ', org_level_parent_code: 'BBI/CDI', children: null } ], result = arr.reduce((acc, item) => { const parentCode = item.org_level_parent_code; const childrenPath = `${parentCode === 'toplevel'? '': parentCode + '/'}${item.org_level_code}`; acc[childrenPath]??= []; (acc[parentCode]??= []).push({...item, children: acc[childrenPath] }) return acc; }, {}).toplevel console.log(JSON.stringify(result, null, 2));
 .as-console-wrapper { max-height: 100%;important: top; 0; }

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM