js 深拷贝及浅拷贝

最新推荐文章于 2025-04-11 00:03:45 发布

爽儿儿儿

最新推荐文章于 2025-04-11 00:03:45 发布

阅读量288

点赞数

分类专栏：深浅拷贝文章标签：深拷贝浅拷贝 js

本文链接：https://blog.csdn.net/Shuanger112/article/details/82222922

版权

深浅拷贝专栏收录该内容

1 篇文章

订阅专栏

本文主要介绍了JavaScript中数组的浅拷贝和深拷贝。简单赋值和concat方法属于浅拷贝，更改其中一个数组，另一个也会改变。还分享了简单粗暴的深拷贝方法，更改一个数组值时另一个不会变，但该方法较消耗内存，此外还有其他深拷贝方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一、数组浅拷贝
在使用JavaScript对数组进行操作的时候，我们经常需要将数组进行备份.

如下代码，如果只是简单才用赋值的方法，那么我们只要更改其中的任何一个，然后其他的也会跟着改变，这就导致了问题的发生

var arr1 = ["red","yellow","black"];
var arr2 = arr1;
arr2[1] = "green";
console.log("数组的原始值：" + arr1 );
console.log("数组的新值：" + arr2);

测试结果发现两个数组的值均发生了改变

亦或者用concat：

var arr1 = ["red","yellow","black"];
var arr2 = [].concat(arr1);
arr2[1] = "green";
console.log("数组的原始值：" + arr1 );
console.log("数组的新值：" + arr2);

此时我们发现两个数组的值依旧发生了改变，得知concat也是对于数组的浅拷贝

一、数组深拷贝

1.分享一个简单粗暴的深拷贝方法：！！！

JSON.parse(JSON.stringify(arr))

于是我们在更改其中一个数组值得时候，另一个数组就不会发生改变了~
这个方法的缺点就是有些消耗内存

copyObj:function (list) {
   var a = [];
     for(var i = 0;i<list.length;i++){
       let res = {}
       for (var key in list[i]) {
         res[key] = list[i][key]
       }
       a.push(res)
     }
     return a
   }

这个方法同样可以进行数组的深拷贝