オブジェクトを変数にコピー/クローンした後、値を変更して別のオブジェクトに影響を与えようとしないときに参照に問題があります。Object.Assign on Composite Object
私はObject.Assign
メソッドの文書を調べていますが、深いクローンのために持っているものをうまくいかないことを試みました。
私は自分をより良く表現し、適切に行う方法を知っている場合に備えて、plnkrを作成しました。 @czoselの答えを
const value = 20.20;
let a = { a: 10 };
let bb = { v: value };
let b = { b: 20, bb: bb };
let c = { c: 30 };
let object1 = { name: 'cloneObject', a, b, c }
let object2 = Object.assign({}, object1);
let object3 = Object.assign({}, object1);
object1.name = 'it works fine';
object1.b.bb.v = 999; // this will change same property in object2 & object3 and it shouldn't
document.getElementById('expected1').innerHTML = object1.b.bb.v;
document.getElementById('expected2').innerHTML = value;
document.getElementById('expected3').innerHTML = value;
document.getElementById('name1').innerHTML = object1.name;
document.getElementById('name2').innerHTML = object2.name;
document.getElementById('name3').innerHTML = object3.name;
document.getElementById('value1').innerHTML = object1.b.bb.v;
document.getElementById('value2').innerHTML = object2.b.bb.v;
document.getElementById('value3').innerHTML = object3.b.bb.v;
<table style="width:100%; text-align: center">
<tr>
<th>Object</th>
<th>Name</th>
<th>Value</th>
<th>Expected Value</th>
</tr>
<tr>
<td>Object 1</td>
<td id='name1'></td>
<td id='value1'></td>
<td id='expected1'></td>
</tr>
<tr>
<td>Object 2</td>
<td id='name2'></td>
<td id='value2'></td>
<td id='expected2'></td>
</tr>
<tr>
<td>Object 3</td>
<td id='name3'></td>
<td id='value3'></td>
<td id='expected3'></td>
</tr>
</table>
、私が得た:
JSON.parse(JSON.stringify(object1));
をだから、このようになります:
を@ gon250は親クラスで実装する予定であり、デフォルトでメソッドを継承するので、私は@ gon250の方が良い答えを見つけました。再帰性がより効率的になると私は思う。
ありがとうございます! :)