Object.assignを使用して動的キーでハッシュマップフィールドを更新し、突然変異を避けるにはどうすればよいですか？

Question

updaterを定義してnewState.c.x === 8に該当するようにし、stateの突然変異を避けるにはどうすればよいですか？

var state = { 
    a: {x: 1, y: 1}, 
    b: {x: 2, y: 2}, 
    c: {x: 3, y: 3}, 
    d: {x: 4, y: 4}, 
}; 

var key = 'c'; 
var x = 8; 

var updater = { 
    //Having state, key and x here.... 

} 

var newState = Object.assign({}, state, updater); 
if(newState.c.x === 8) { 
    wooHoo(); 

} 

ありがとうございます！

Answer 1

いくつかのES6構造解除とObject.assign()を使用できます。

var state = { 
 
    a: {x: 1, y: 1}, 
 
    b: {x: 2, y: 2}, 
 
    c: {x: 3, y: 3}, 
 
    d: {x: 4, y: 4}, 
 
}; 
 

 
var key = 'c'; 
 
var x = 8; 
 

 
var updater = { 
 
    [key]: Object.assign({}, state[key], {x}) 
 
} 
 

 
var newState = Object.assign({}, state, updater); 
 
if(newState.c.x === 8) { 
 
    alert('True') 
 
}