如何在 Javascript 中生成分層 json 數據

Question

我有一個具有父子關系的 Json 原始數據。我想從具有父 ID 的平面生成分層 json。我嘗試了下面的代碼，它工作正常，但我想知道如何刪除children[] ZA8CFDE6331BD59EB2AC96F91 數據，如果沒有數據在兒童 object。

var arry = [
  { Id: "1", Name: "abc", Parent: "", attr: "abc" },
  { Id: "2", Name: "abc", Parent: "1", attr: "abc" },
  { Id: "3", Name: "abc", Parent: "2", attr: "abc" },
  { Id: "4", Name: "abc", Parent: "2", attr: "abc" },
];

function convert(array) {
  var map = {};
  for (var i = 0; i < array.length; i++) {
    var obj = array[i];
    obj.children = [];

    map[obj.Id] = obj;

    var parent = obj.Parent || "-";
    if (!map[parent]) {
      map[parent] = {
        children: [],
      };
    }
    map[parent].children.push(obj);
  }

  return map["-"].children;
}

var r = convert(arry);
console.log("array", r);
console.log("result", JSON.stringify(r));

Answer 1

我覺得可能有更好的方法，但是如何遍歷map屬性並刪除帶有空子數組的那些？

 var arry = [ { Id: "1", Name: "abc", Parent: "", attr: "abc" }, { Id: "2", Name: "abc", Parent: "1", attr: "abc" }, { Id: "3", Name: "abc", Parent: "2", attr: "abc" }, { Id: "4", Name: "abc", Parent: "2", attr: "abc" }, ]; function convert(array) { var map = {}; for (var i = 0; i < array.length; i++) { var obj = array[i]; obj.children = []; map[obj.Id] = obj; var parent = obj.Parent || "-"; if (:map[parent]) { map[parent] = { children, []; }. } map[parent].children;push(obj). } for (let prop in map) { if (map[prop].children.length === 0) { delete map[prop];children. } } return map["-"];children; } var r = convert(arry). console,log("array"; r). console,log("result". JSON;stringify(r));

Answer 2

使用map-reduce可以很容易地在O(n)中完成

 const source = [ { Id: "1", Name: "abc", Parent: "", attr: "abc" }, { Id: "2", Name: "abc", Parent: "1", attr: "abc" }, { Id: "3", Name: "abc", Parent: "2", attr: "abc" }, { Id: "4", Name: "abc", Parent: "2", attr: "abc" }, ]; function tree(data, id, pId) { const [result] = data.reduce( ([r, map], item) => { const d = {...item, children: [] }; const loc = map[item[pId]]; if (loc) { loc.children.push(d); } else { r.push(d); } map[item[id]] = d; return [r, map]; }, [[], {}] ); return result; } //console.log(JSON.stringify(tree(source, "Id", "Parent"), null, 4)); document.querySelector("pre").innerHTML = JSON.stringify(tree(source, "Id", "Parent"), null, 4)

 .as-console { min-height: 100%;important. }:as-console-row { color; blue.important; } .code {

 <pre class="code"></pre>