从对象的javascript数组创建树结构

时间:2019-10-15 07:31:39

标签: javascript json

我有一个这样的对象数组。

var obj_1 = {id:1, title:"Title 1", unitId:0, line: 0};
var obj_2 = {id:2, title:"Title 1.1", unitId:1, line: 0};
var obj_3 = {id:3, title:"Title 1.2", unitId:1, line: 1};
var obj_4 = {id:4, title:"Title 1.1.1", unitId:0, line: 1};
var obj_5 = {id:5, title:"Title 2", unitId:0, line: 1};

var obj_list = [obj_1,obj_2,obj_3,obj_4,obj_5];

我想将json转换为树结构,这样的结果结构

Unit 0: {
  Line 0: {
     children: {
        {id:1, title:"Title 1", unitId:0, line: 0}
     }
  },
  Line 1: {
     children: {
        {id:4, title:"Title 1.1.1", unitId:0, line: 1},
        {id:5, title:"Title 2", unitId:0, line: 1}
     }
  }
}
Unit 1: {
  Line 0: {
     children: {
        {id:2, title:"Title 1.1", unitId:1, line: 0}
     }
  },
  Line 1: {
     children: {
        {id:2, title:"Title 1.2", unitId:1, line: 2}
     }
  }
}

如果有人知道该怎么做,请回答。预先感谢

3 个答案:

答案 0 :(得分:1)

您可以采用一组所需的键进行嵌套,并使用此键构建新对象,然后将对象末尾推入children属性。

var data = [{ id: 1, title: "Title 1", unitId: 0, line: 0 }, { id: 2, title: "Title 1.1", unitId: 1, line: 0 }, { id: 3, title: "Title 1.2", unitId: 1, line: 1 }, { id: 4, title: "Title 1.1.1", unitId: 0, line: 1 }, { id: 5, title: "Title 2", unitId: 0, line: 1 }],
    keys = [['unitId', 'Unit'], ['line', 'Line']],
    result = data.reduce((r, o) => {
        var target = keys.reduce((q, [k, t]) => {
                var key = [t, o[k]].join(' ');
                return q[key] = q[key] || {};
            }, r);
        (target.children = target.children || []).push(o);
        return r;
    }, {});

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

与特殊键字母相同。

var data = [{ id: 1, title: "Title 1", unitId: 0, line: 0 }, { id: 2, title: "Title 1.1", unitId: 1, line: 0 }, { id: 3, title: "Title 1.2", unitId: 1, line: 1 }, { id: 4, title: "Title 1.1.1", unitId: 0, line: 1 }, { id: 5, title: "Title 2", unitId: 0, line: 1 }],
    keys = [['unitId', 'Unit'], ['line', 'Line', v => (10 + v).toString(36).toUpperCase()]],
    result = data.reduce((r, o) => {
        var target = keys.reduce((q, [k, t, fn = v => v]) => {
                var key = [t, fn(o[k])].join(' ');
                return q[key] = q[key] || {};
            }, r);
        (target.children = target.children || []).push(o);
        return r;
    }, {});

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

答案 1 :(得分:0)

首先:获得所需的结构:

const structure = [];
for (obj of obj_list) {
  if (!structure[obj.unitId]) {
    structure[obj.unitId] = [];
  }
  if (!structure[obj.unitId][obj.line]) {
    structure[obj.unitId][obj.line] = [];
  }
  structure[obj.unitId][obj.line].push(obj);
}

下一步:以您想要的格式输出。 您可能可以完成最后一步。

答案 2 :(得分:0)

可能有一种更清洁的方法,只是想快速给出答案

const obj_1 = { id: 1, title: 'Title 1', unitId: 0, line: 0 };
const obj_2 = { id: 2, title: 'Title 1.1', unitId: 1, line: 0 };
const obj_3 = { id: 3, title: 'Title 1.2', unitId: 1, line: 1 };
const obj_4 = { id: 4, title: 'Title 1.1.1', unitId: 0, line: 1 };
const obj_5 = { id: 5, title: 'Title 2', unitId: 0, line: 1 };

const obj_list = [obj_1, obj_2, obj_3, obj_4, obj_5];

newJson = {};
obj_list.forEach(el => {
    newJson[`unit${el.unitId}`] ? null : (newJson[`unit${el.unitId}`] = {});
    newJson[`unit${el.unitId}`][`line${el.line}`]
        ? null
        : (newJson[`unit${el.unitId}`][`line${el.line}`] = {});
    newJson[`unit${el.unitId}`][`line${el.line}`].children
        ? null
        : (newJson[`unit${el.unitId}`][`line${el.line}`].children = []);

    newJson[`unit${el.unitId}`][`line${el.line}`].children.push(el);
});

console.log(newJson);