Verschachtelte Objekt Array-Werte in ein anderes Array

Question

Das ist ähnlich zu this question, aber mit einer leichten Wendung darin, dass es andere Objektwerte neben den Arrays und ich kann nicht ganz scheinen, die genaue Syntax herauszufinden, was ich brauche.

Ich habe so etwas wie dies:

const metadata = [ 
    { 
    stepName: 'Step one', 
    controls: [ 
     {fieldName: 'one', label: 'Field One', type: 'input'}, 
     {fieldName: 'two', label: 'Field Two', type: 'multiline'} 
    ] 
    }, 
    { 
    stepName: 'Step two', 
    controls: [ 
     {fieldName: 'three', label: 'Field Three', type: 'input'}, 
     {fieldName: 'four', label: 'Field Four', type: 'multiline'} 
    ] 
    } 
] 

... und ich möchte für Feldname in dort eigene Array mit allen Werten erhalten, so dass ich am Ende mit etwas wie:

someFieldArray = ['one', 'two', 'three', 'four'] 

Fast bei jedem Versuch habe ich irgendwo Drosseln gemacht. Ich weiß, dass ich eine Kombination aus Iteration und Destrukturierung verwende, aber ich kann nicht genau die genaue Syntax und Kombination korrekt finden. Ich benutze ES2015 (6), die mit Babel transpiliert werden. Jede Hilfe, wie man das macht, wird geschätzt! Ich kann Metadaten zuerst in ein Objekt zerlegen, wenn das die Dinge einfacher macht ({... Metadaten}).

Answer 1

Da Sie eine ES6 Ansatz sind gefragt, könnte diese Lösung sein, was Sie suchen.

[].concat(...metadata.map(item => item.controls.map(obj => obj.fieldName))); 

Answer 2

In ES5 könnten Sie dies schreiben.

var metadata = [{ stepName: 'Step one', controls: [{ fieldName: 'one', label: 'Field One', type: 'input' }, { fieldName: 'two', label: 'Field Two', type: 'multiline' }] }, { stepName: 'Step two', controls: [{ fieldName: 'three', label: 'Field Three', type: 'input' }, { fieldName: 'four', label: 'Field Four', type: 'multiline' }] }], 
 
    result = metadata.reduce(function (r, a) { 
 
     return r.concat(a.controls.map(function (b) { return b.fieldName; })); 
 
    }, []); 
 

 
document.write('<pre>' + JSON.stringify(result, 0, 4) + '</pre>');