简体   繁体   English

以树形结构排列JSON

[英]Arrange JSON in tree structure

I have a plain JSON that contasins the id's of its dependentant's objects.. 我有一个普通的JSON,包含了其依赖对象的ID。

 var array1=  

    [
        {
            "id": 84,
            "outputTypeId": 900000000000002,
            "previousOutputTypeActivitySeqMappingId": null,
            "isRemoved": false,
            "isPrimary": false
        },
        {
            "id": 95,
            "outputTypeId": 900000000000002,
            "previousOutputTypeActivitySeqMappingId": 84,
            "isRemoved": false,
            "isPrimary": false
        },
        {
            "id": 150,
            "outputTypeId": 900000000000002,
            "previousOutputTypeActivitySeqMappingId": 95,
            "isRemoved": false,
            "isPrimary": false
        },
        {
            "id": 160,
            "outputTypeId": 900000000000002,
            "previousOutputTypeActivitySeqMappingId": 95,
            "isRemoved": false,
            "isPrimary": false
        }
    ]

I wanted to convert to the below format by identifying the "id" and "previousOutputTypeActivitySeqMappingId" and pushing it into a new array called items 我想通过识别“ id”和“ previousOutputTypeActivitySeqMappingId”并将其推入名为items的新数组中,将其转换为以下格式

var array1=

    [{
        "id": 84,
        "outputTypeId": 900000000000002,
        "previousOutputTypeActivitySeqMappingId": null,
        "isRemoved": false,
        "isPrimary": false,
        "items": [
            {
                "id": 95,
                "outputTypeId": 900000000000002,
                "previousOutputTypeActivitySeqMappingId": 84,
                "isRemoved": false,
                "isPrimary": false,
                "items": [
                    {
                        "id": 150,
                        "outputTypeId": 900000000000002,
                        "previousOutputTypeActivitySeqMappingId": 95,
                        "isRemoved": false,
                        "isPrimary": false,
                        "items": []
                    },
                    {
                        "id": 160,
                        "outputTypeId": 900000000000002,
                        "previousOutputTypeActivitySeqMappingId": 95,
                        "isRemoved": false,
                        "isPrimary": false,
                        "items": []
                    }
                ]
            }
        ]
    }]

The code that I tried is given below... I created a dummy object first in the new format: 我尝试的代码如下:我首先以新格式创建了一个虚拟对象:

var dummyObj= {
        "id": 84,
        "outputTypeId": 900000000000002,
        "previousOutputTypeActivitySeqMappingId": null,
        "isRemoved": false,
        "isPrimary": false
    }
function populateObj(array1, arrObj) {
   for (var i = 0; i < array1.length; i++) {
        if (array1[i].id == arrObj.parentActivityId) {
            array1[i].items.push(arrObj);
        } else {
            populateObj(array1[i].items, arrObj);
        }
    }
};

populateObj(dummyObj);

Since I don't want to hardcode a dummy object in the beginning. 由于我不想在一开始就对一个虚拟对象进行硬编码。 Is there any way to achieve this conversion using javascript? 有什么方法可以使用javascript实现此转换?
Thanks. 谢谢。

This can be done quite easily with a few functions and a bit of recursion. 使用一些功能和一点递归就可以很容易地做到这一点。

The first function takes the entire source array a source object and adds the items property: 第一个函数将整个源数组作为一个源对象,并添加items属性:

function createObject(sourceArray, obj)
{
    obj.items = createArray(sourceArray, obj.id);
  return obj;
}

That in turn uses another function to filter the source array for the children: 依次使用另一个函数为子级过滤源数组:

function createArray(sourceArray, id){
    return sourceArray.filter(function(e){
                                return e.previousOutputTypeActivitySeqMappingId == id;
                             })
                             .map(function(e){
                                 return createObject(sourceArray,e);
                             })
}

You'll note that in tun that calls back to the createObject function to recursively continue building the tree. 您会注意到,在tun中,它回调了createObject函数以递归方式继续构建树。

The final part is to kick it all of by looking for items with null parent values 最后一部分是通过查找具有null父值的项目来解决所有问题

var result = createArray(input,null);

Live example: https://jsfiddle.net/3epjb93j/ 实时示例: https//jsfiddle.net/3epjb93j/

function group(arr) {
    var t={};
    arr.forEach(function(obj) {
        if (!obj.id) throw 'object found without id!';
        t[obj.id]=obj;
    });
    var result=[];
    arr.forEach(function(obj) {
        if (!obj.previousOutputTypeActivitySeqMappingId) {
            result.push(obj);
        } else {
            var parent=t[obj.previousOutputTypeActivitySeqMappingId];
            if (!parent) throw('parent with id '+obj.previousOutputTypeActivitySeqMappingId+' not found!');
            var items=parent.items;
            if (!items) {
                items=[];
                parent.items=items;
            }
            items.push(obj);
        }
    });
    return result;
}

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

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