Javascript 不變性：深拷貝字典

Question

我正在使用 react-redux，我想深度復制 redux state。

比如我有下面的state

state = { teststate: 0, number: { testnumber1: 10, testnumber2: 20 } }

在這種情況下，我想更改testnumber1的值。

我試過這樣，但這不起作用。

Object.assign（{}，state，{testnumber1：30}}

如何更改 testnumber1 的值？

Answer 1

使用Object.assign你可以做

 state = { teststate: 0, number: { testnumber1: 10, testnumber2: 20 } } var newobject={teststate:state.teststate,number:Object.assign({},state.number)} var assign=Object.assign(newobject.number,{testnumber1:30}) console.log(newobject) console.log(state)

Answer 2

我們最好不要直接改變 state 而不是返回克隆的 state。 您可以使用 map 轉換數組或使用 splice 獲取新數組以替換舊數組。

 const state = { teststate: 0, number: [ {testnumber1: 10}, {testnumber2: 20}, {testnumber3: 40} ] } const newNumber = state.number.map(n => { if(Object.keys(n).toString() === 'testnumber1'){ return {testnumber1: 30}; } return n; }); const newState = {...state, number: newNumber}; console.log("\n newState\n", newState); console.log("\n state\n", state);