将对象列表转换为 json 树结构答案

【问题标题】：Convert a list of objects to a json tree structure将对象列表转换为 json 树结构
【发布时间】：2014-01-20 09:26:41
【问题描述】：

我有一个需要转换成 json 格式的列表。

这个..

var sourceList = [
    { title: "item-1", indent: "0" },
    { title: "item-2", indent: "0" },
    { title: "item-3", indent: "0", folder: true },
    { title: "item-4", indent: "1" },
    { title: "item-5", indent: "1", folder: true },
    { title: "item-6", indent: "2" },
    { title: "item-7", indent: "2" },
    { title: "item-8", indent: "0" }
];

到这个..

var targetJson = [
    { title: "item-1" },
    { title: "item-2" },
    { title: "item-3", folder: true, children: [
        { title: "item-4" },
        { title: "item-5", folder: true, children: [
            { title: "item-6" },
            { title: "item-7" }
        ]},
    ]},
    { title: "item-8" }
];

这样结果就可以用来初始化如下的树形结构。

    item-1
    item-2
    item-3
    .. item-4
    .. item-5
    .... item-6
    .... item-7
    item-8

每个源对象的“缩进”属性决定了它相对于前一个对象的位置。

如果一个对象的缩进大于前一个，那么它将被视为前一个的子对象，如果它的缩进与前一个相同，则它被视为前一个的兄弟。所以子项的节点会出现children属性和folder属性。

其中一个挑战是“第 8 项”，它处于第 0 级，而前一个处于第 2 级。

需要一个解决方案，最好是在 javascript 中。

【问题讨论】：

标签： javascript jquery json list tree

【解决方案1】：

我保留了缩进和要添加子元素的元素之间的映射：

// test data
var sourceList = [
    { title: "item-1", indent: "0" },
    { title: "item-2", indent: "0" },
    { title: "item-3", indent: "0", folder: true },
    { title: "item-4", indent: "1" },
    { title: "item-5", indent: "1", folder: true },
    { title: "item-6", indent: "2" },
    { title: "item-7", indent: "2" },
    { title: "item-8", indent: "0" }
];

// init
var targetJson = [];
var roots = { 0 : targetJson};

// actual code:
sourceList.forEach(function(item){
  if (!roots[item.indent].splice) {
    roots[item.indent] = roots[item.indent].children = [];
  }
  roots[item.indent].push(item);
  if (item.folder) {
    roots[+item.indent+1] = item;
  }
});

// output
console.log(targetJson);

PS：我在对象中保留了 indent 属性，以便您检查结果。添加项目后，请随意将其删除。这是无关紧要的。

【讨论】：