在使用JavaScript对数组进行操作的时候，我们经常需要将数组进行备份，事实证明如果只是简单的将它赋予其他变量，那么我们只要更改其中的任何一个，然后其他的也会跟着改变，这就导致了问题的发生。
参考Object.assign()：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/assign
<!DOCTYPE html>
<html>
<head>
<title>测试深拷贝，浅拷贝方法及现象</title>
</head>
<body>
<script type="text/javascript">
//Object.assign()方法是浅拷贝
var myobject={
a:"a",
b:"b",
c:"c",
}
var newobject=Object.assign({},myobject);
newobject.a=222;
document.writeln("原始："+JSON.stringify(myobject));
document.writeln("现在："+JSON.stringify(newobject));
function test() {
‘use strict‘;
let obj1 = { a: 0 , b: { c: 0}};
let obj2 = Object.assign({}, obj1);
console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}}
obj1.a = 1;
console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}}
console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}}
obj2.a = 2;
console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}}
console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 0}}
obj2.b.c = 3;
console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 3}}
console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 3}}
// Deep Clone
//利用json方法是深复制，但要JSON安全
obj1 = { a: 0 , b: { c: 0}};
let obj3 = JSON.parse(JSON.stringify(obj1));
obj1.a = 4;
obj1.b.c = 4;
console.log(JSON.stringify(obj3)); // { a: 0, b: { c: 0}}
}
test();
</script>
<!-- <script type="text/javascript">
//这是浅拷贝，该变拷贝的对象会改变原始对象的值
var arr = ["One","Two","Three"];
var arrto = arr;
arrto[1] = "test";
document.writeln("数组的原始值：" + arr + "<br />");//Export:数组的原始值：One,test,Three
document.writeln("数组的新值：" + arrto + "<br />");//Export:数组的新值：One,test,Three
</script>
-->
<!-- <script type="text/javascript">
//这是深拷贝，该变现有对象不会改变原始对象的值
var arr = ["One","Two","Three"];
var arrtoo = arr.slice(0);
arrtoo[1] = "set Map";
document.writeln("数组的原始值：" + arr + "<br />");//Export:数组的原始值：One,Two,Three
document.writeln("数组的新值：" + arrtoo + "<br />");//Export:数组的新值：One,set Map,Three
</script> -->
<!-- <script type="text/javascript">
//这是深拷贝
var arr = ["One","Two","Three"];
var arrtooo = arr.concat();
arrtooo[1] = "set Map To";
document.writeln("数组的原始值：" + arr + "<br />");//Export:数组的原始值：One,Two,Three
document.writeln("数组的新值：" + arrtooo + "<br />");//Export:数组的新值：One,set Map To,Three
</script> -->
<!-- <script type="text/javascript">
//深拷贝，json方法是深拷贝
var someobj={
a:"a",
b:"b",
c:"c"
}
var newobject=JSON.parse(JSON.stringify(someobj));
someobj.a="aaaa";
document.writeln("原始："+JSON.stringify(someobj)+"<br/>");
document.writeln("现在："+JSON.stringify(newobject)+"<br/>");
//原始：{"a":"aaaa","b":"b","c":"c"}
// 现在：{"a":"a","b":"b","c":"c"}
</script> -->
</body>
</html>
这里只是浅尝辄止，以后还会继续探究。
总结：浅拷贝Object.assign()，
深拷贝用JSON.parse(JSON.stringify(someobj));
但要保证someobj是json安全的，符合json规则。
原文地址：https://www.cnblogs.com/wulinzi/p/8283814.html
时间： 2024-10-11 02:54:07