Wie man zwei verschiedene Array-Objekte zusammen bekommt

Question

Hier habe ich meinen JSON angeschlossen.

"mainSteps": [ 
    { 
    "id": "9b3b64b4-d8a5-46d5-b464-066dc5c45dc3", 
    "name": "Main Step 1", 
    "steps": [ 
     { 
     "name": "sub step 1.1" 
     }, 
     { 
     "name": "sub step 1.2" 
     } 
    ] 
    }, 
    { 
    "name": "Main step 2" 
    "steps": [ 
     { 
     "name": "sub step 2.1" 
     }, 
     { 
     "name": "sub step 2.2" 
     } 
    ], 
    }, 
    { 
    "name": "Main Step 3", 
    "steps": [ 
     { 
     "name": "sub step 3.1" 
     }, 
     { 
     "name": "sub step 3.2" 
     } 
    ], 
    } 
] 

ist für die Ausgabe wie die Suche -> [Main Schritt 1, Unter Schritt 1.1, Unter Schritt 1.2], [Main Schritt 2, Unter Schritt 2.1, Unter Schritt 2.2], [Main Schritt 3, sub Schritt 3.1, Unterschritt 3.2]. Ich verbringe den ganzen Tag für diese Ausgabe, aber bekomme Ausgabe wie [[Hauptschritt 1, Hauptschritt 2, Hauptschritt 3, Unterschritt 1.1, Unterschritt 1.2 ....] Wie das, bekomme ich verschiedene Formate, bin aber nicht in der Lage, zu bekommen die tatsächliche Ausgabe, wie ich erwähnt habe, kann jemand mich klären.

\t var dataProcess = { 
 
     \t \t \t \t parentProcess:[], 
 
     \t \t \t \t subProcess:[] 
 
     \t \t     }; \t \t      
 
    var steps = mainData.steps; // Steps Having the Full json data     
 
     \t \t var proc = []; 
 
       $scope.getSteps = function(steps) { 
 
        for (var i=0;i< steps.length;i++) { 
 
       \t  dataProcess.parentProcess.push(steps[i].name); 
 
       \t  for(var j=i;j<steps[i].steps.length;j++){ 
 
       \t \t dataProcess.subProcess.push(steps[i].steps[j].name); 
 
       \t } 
 
        }

Dies ist eine der Art und Weise habe ich versucht,

Answer 1

Mai werden Sie wie dies tun können;

var mainSteps = [ 
 
    { 
 
    "id": "9b3b64b4-d8a5-46d5-b464-066dc5c45dc3", 
 
    "name": "Main Step 1", 
 
    "steps": [ 
 
     { 
 
     "name": "sub step 1.1" 
 
     }, 
 
     { 
 
     "name": "sub step 1.2" 
 
     } 
 
    ] 
 
    }, 
 
    { 
 
    "name": "Main step 2", 
 
    "steps": [ 
 
     { 
 
     "name": "sub step 2.1" 
 
     }, 
 
     { 
 
     "name": "sub step 2.2" 
 
     } 
 
    ], 
 
    }, 
 
    { 
 
    "name": "Main Step 3", 
 
    "steps": [ 
 
     { 
 
     "name": "sub step 3.1" 
 
     }, 
 
     { 
 
     "name": "sub step 3.2" 
 
     } 
 
    ], 
 
    } 
 
], 
 
mapped = mainSteps.map(e => [e.name, e.steps[0].name, e.steps[1].name]); 
 
console.log(mapped);

Answer 2

Wenn Sie ES5 Syntax:

var details = mainSteps.map(function(step) { 
    return [ step.name ].concat((step.steps || []).map(function(substep){ 
    return substep.name; 
    }) 
}); 

ES6 Syntax:

var details = mainSteps.map(step =< [step.name].concat((step.steps || []).map(sub => sub.name)); 

Wenn Sie mehr Rekursion als eine Schicht tiefer benötigen, können Sie ein verwenden Funktion als Top-Level-Mapper, der sich selbst aufruft.

Answer 3

Einfache Lösung unter Verwendung von Array.map und Array.concat Funktionen:

// supposing "obj" is your initial object 
var dataProcess = obj.mainSteps.map(function (o) { 
    return [o.name].concat(o.steps.map(function(v){ return v.name; })); 
}); 

console.log(JSON.stringify(dataProcess, 0, 4)); 

Der Ausgang:

[ 
    [ 
     "Main Step 1", 
     "sub step 1.1", 
     "sub step 1.2" 
    ], 
    [ 
     "Main step 2", 
     "sub step 2.1", 
     "sub step 2.2" 
    ], 
    [ 
     "Main Step 3", 
     "sub step 3.1", 
     "sub step 3.2" 
    ] 
] 

DEMO link

Answer 4

Auf diese Weise ist es mit verschiedener Länge der Array und Subarrays arbeiten:

var results = mainSteps.map(x => [x.name].concat(x.steps.map(y => y.name)));