简体   繁体   中英

Arrange JSON in tree structure

I have a plain JSON that contasins the id's of its dependentant's objects..

 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

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?
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:

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.

The final part is to kick it all of by looking for items with null parent values

var result = createArray(input,null);

Live example: 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;
}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

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