Deepcopy in React

Question

レデューサーでは、常にObject.assign({},state,newState)を使用して状態を保存します。ただし、assign()は、ディープコピーをサポートしていません。このメソッドは、マルチレベルオブジェクトの参照のみをコピーするためです。これはプログラムのコードです。

const menuListState={ 
 
\t menuList: {}, 
 
\t menuListLoading:false 
 
} 
 
function getMenuList(state=menuListState,action=defaultAction){ 
 
\t switch(action.type){ 
 
\t \t //menuList begin 
 
\t \t case actions.GET_MENULIST_SUCCESS: 
 
\t \t  return Object.assign({},state,{ 
 
\t \t \t  menuList:action.data, 
 
\t \t \t  menuListLoading:false 
 
\t \t  }); 
 

 
\t \t default: 
 
\t \t \t return state; 
 
\t } 
 
}

性menuListは、マルチレベルのオブジェクトです。 action.dataが変更された場合、方法assign()が機能する直前にstate.menuListが変更されますか？

Answer 1

JSON.stringifyを使用してオブジェクトを文字列化し、JSON.parseを使用して結果文字列をオブジェクトに解析すると、深くコピーしたいオブジェクトと同じ新しいオブジェクトを取得できます。

これまでの投票では何が投票ですか？

Answer 2

action.dataが参照型（オブジェクト、配列など）の場合は、action.dataを変更するとすぐにstate.menuListが変更されます。これらは同じ値を参照するためです。それはJavascriptの通常の機能です。

Answer 3

あなたは次のように使用cloneDeepフォームlodash、に興味がある可能性があり：

var objects = [{ 'a': 1 }, { 'b': 2 }]; 

var deep = _.cloneDeep(objects); 
console.log(deep[0] === objects[0]); 
// => false 

Heres the npm package for just that method.