JavaScriptを使用して動的に条件オブジェクトを作成する

Question

別のオブジェクトの内容に基づいてオブジェクトを作成しようとしています。私は以下のキー/値を含むオブジェクトを持っています：

var inputObject = { 
    "color": [ 
     "black", 
     "red", 
     "green" 
    ], 
    "bottom": [ 
     "A", 
     "B", 
     "C", 
     "D", 
    ], 
    "top": [ 
     "L", 
     "M" 
    ] 
    } 

このオブジェクトを変更して、動的な数のキーを作成します。

var outputObject = { 

    "blackBottom": [ 
     "A", 
     "B", 
     "C", 
     "D", 
    ], 
    "redBottom": [ 
     "A", 
     "B", 
     "C", 
     "D", 
    ], 
    "greenBottom": [ 
     "A", 
     "B", 
     "C", 
     "D", 
    ], 
    "blackTop": [ 
     "L", 
     "M" 
    ], 
    "redTop": [ 
     "L", 
     "M" 
    ], 
    "greenTop": [ 
     "L", 
     "M" 
    ] 
} 

次の条件が満たされる：

• を"color"キーの内部には、色、または存在しない"color"鍵は、すべての4 "color" + "Bottom" and "Top"
を作成し、あってはならないここに私の意図した出力があります
• オブジェクト内に1つの色しか存在しない場合は、そのオブジェクトを作成してください。"color" + "Bottom" and "Top"
• には何も入力しないでくださいを作成したら、"color" + "Bottom"

outputObjectを作成するにはどうすればよいですか？

Answer 1

反復して使用してオブジェクトを結果として入力します。結果として、outputObjectは次のようになります

var outputObject = { 
    // unconditional things 
    exampleUnconditional: [ 
     "someValue" 
    ] 
}; 

if(inputObject. /* your condition here */) { 
    outputObject.exampleConditional = [ 
     "someContent" 
    ] 
}; 

そしてそうreduce

// The ES6 version, with the flexibility requested 
 

 
const generate = ({color: colors, bottom, top}) => 
 
    colors.reduce(
 
    (acc, color) => Object.assign(acc, 
 
     bottom && {[`${color}Bottom`]: [...bottom]}, 
 
     top && {[`${color}Top`]: [...top]} 
 
     ), 
 
    {}) 
 

 
// The ES5 version 
 

 
function generateOldGoodES5(input) { 
 
    // extract values from input w/o destructuring 
 
    var colors = input.color, 
 
     bottom = input.bottom, 
 
     top = input.top; 
 

 
    return colors.reduce(function(out, color){ 
 
    // assign corresponding properties 
 
    out[color + 'Bottom'] = bottom.slice(); // copy array 
 
    out[color + 'Top'] = top.slice(); // copy array 
 

 
    return out 
 
    }, {}); 
 

 
} 
 

 
var inputObject = { 
 
    "color": [ 
 
     "black", 
 
     "red", 
 
     "green" 
 
    ], 
 
    "bottom": [ 
 
     "A", 
 
     "B", 
 
     "C", 
 
     "D", 
 
    ], 
 
    "top": [ 
 
     "L", 
 
     "M" 
 
    ] 
 
    } 
 
    
 
console.log("ES6 Output") 
 
console.log(generate(inputObject)) 
 

 
console.log("ES5 Output") 
 
console.log(generateOldGoodES5(inputObject))

Answer 2

あなたは、このように動的にoutputObjectに動的に情報を追加することができます。各色の上

{ 
    exampleUnconditional: [ 
     "someValue" 
    ], 
    exampleConditional: [ 
     "someContent" 
    ] 
}