How to iterate an array with key which appears different combination in nested array in javascript

user_2550371 0
Viewed 31

i have an array structure like below, which has combinedPorts as key with nested array. i can able to iterate and display the properties with .map function in ES6 if all the object has same number of combinedPorts key. But here in the first object the combinedPorts array appears three time whereas in second object the combinedPorts array appears twice. How to iterate the combinedPorts key if it appears different from one object to other.

[
    
    {
        "name": "Test Source",
        "combinedPorts": [
            {
                "name": "PortGroup_1",
                "templateId": "edfb5b72ec580b129465ea0e8029bad3",
                "type": "SourcePorts",
                "combinedPorts": [
                    {
                        "name": "Source_1",
                        "templateId": "2355fc02e18cd48c6b487aa8b6f75959",
                        "type": "SourcePorts",
                        
                        "combinedPorts": [
                            {
                                "name": "Sami_TestSource",
                                "templateId": "0007ad49ea9b02b309a1248592a01981",
                                "type": "SourcePorts"
                            },
                            
                        ],
                        
                    }
                ],
                
            }
        ],
        "portGroupInfo": []
    },
    {
        "name": "Test Source",
        "combinedPorts": [
            {
                "name": "PortGroup_1",
                "templateId": "edfb5b72ec580b129465ea0e8029bad3",
                "type": "SourcePorts",
                "combinedPorts": [
                    {
                        "name": "Source_1",
                        "templateId": "2355fc02e18cd48c6b487aa8b6f75959",
                        "type": "SourcePorts"
                    }
                ],
                
            }
        ],
        "portGroupInfo": []
    }
]

can someone guide me achieve this using ES6. Thanks in advance.

ecmascript-6 arrays javascript
1 Answers

I would suggest using a recursive approach, this will deal with any level of nesting.

We'd create a function getNestedArrays() that will combine the elements in nested arrays of a given name: arrayName.

At each level, if we find the right array, we'll add the array to our output without any child arrays, then continue walking through the structure.

let input = [  { "name": "Test Source", "combinedPorts": [ { "name": "PortGroup_1", "templateId": "edfb5b72ec580b129465ea0e8029bad3", "type": "SourcePorts", "combinedPorts": [ { "name": "Source_1", "templateId": "2355fc02e18cd48c6b487aa8b6f75959", "type": "SourcePorts",  "combinedPorts": [ { "name": "Sami_TestSource", "templateId": "0007ad49ea9b02b309a1248592a01981", "type": "SourcePorts" },  ],  } ],  } ], "portGroupInfo": [] }, { "name": "Test Source", "combinedPorts": [ { "name": "PortGroup_1", "templateId": "edfb5b72ec580b129465ea0e8029bad3", "type": "SourcePorts", "combinedPorts": [ { "name": "Source_1", "templateId": "2355fc02e18cd48c6b487aa8b6f75959", "type": "SourcePorts" } ],  } ], "portGroupInfo": [] } ]
function getNestedArrays(obj, arrayName) {
    let result = [];
    for(let key in obj) {
       if (obj[key] && typeof(obj[key]) === 'object') {
           if ((key === arrayName) && Array.isArray(obj[key])) {
               // We've found our array, add without child arrays...
               result.push(...obj[key].map(({ [arrayName]: x, ...row}) => ({ ...row })))
           }
           result.push(...getNestedArrays(obj[key], arrayName));
       }
    }
    return result;
}

console.log(input.map(obj => {
    obj.combinedPorts = getNestedArrays(obj, 'combinedPorts');
    return obj;
}));
.as-console-wrapper { max-height: 100% !important; }

user_72372240
Related