2つの異なる配列オブジェクトを一緒に取得する方法

Question

ここで私はjsonを付けました。

"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" 
     } 
    ], 
    } 
] 

のような出力を探しています - > [メインステップ1、サブステップ1.1、サブステップ1.2]、[メインステップ2のサブステップ2.1、サブステップ2.2]、[メインステップ3、サブステップ3.1、サブステップ3.2]。私はこの出力のために一日中過ごしますが、[[メインステップ1、メインステップ2、メインステップ3、サブステップ1.1、サブステップ1.2]のような出力を得ています。私が言及したように実際の出力、誰かが私を明確にすることはできますか？

これは私が試した方法の一つである

\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 } 
 
        }

、

Answer 1

あなたは、このように行うことができますすることができ、

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

あなたはES5構文が必要な場合：

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

ES6は構文：

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

あなたが深い一つの層よりも多くの再帰が必要な場合は、使用することができますトップレベルのマッパーとして機能し、自身を呼び出します。

// 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)); 

出力：Array.mapとArray.concat関数を使用して

Answer 3

単純溶液

[ 
    [ 
     "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

この方法は、アレイおよびサブアレイの様々な長さで作業しています：

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