当我尝试将对象复制/克隆到变量中,然后更改一个对象的值而不影响另一个对象时,我遇到了引用问题。
我一直在查看 Object.Assign
的文档方法,我尝试了深度克隆的方法,但没有成功。
我创建了一个 plnkr,以便更好地表达自己,并且以防您知道如何正确地做到这一点。
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>
通过@czosel的回答,我得到:
JSON.parse(JSON.stringify(object1));
所以它看起来像这样:
let object1 = {name: 'cloneObject', a, b, c}
let object2 = JSON.parse(JSON.stringify(object1));
let object3 = JSON.parse(JSON.stringify(object1));
我发现@gon250的答案更好,因为我将在父类中实现它,并且默认情况下它将继承该方法。我认为递归会更有效。
谢谢! :)
最佳答案
下面您可以看到一个克隆对象的简单函数:
function cloneObject(myObj) {
var temp = myObj.constructor();
if (myObj === null || typeof myObj !== 'object') {
return myObj;
}
for (var key in myObj) {
temp[key] = cloneObject(myObj[key]);
}
return temp;
}
以下是在代码中实现该函数的示例:
关于javascript - 复合对象上的 Object.Assign,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40718733/