javascript中的深拷贝和浅拷贝

最新推荐文章于 2025-08-09 20:51:19 发布

Luna_hua

最新推荐文章于 2025-08-09 20:51:19 发布

阅读量180

点赞数

分类专栏： js 文章标签： javascript 对象

js 专栏收录该内容

12 篇文章

订阅专栏

首先深复制和浅复制只针对像object，array这样的复杂对象。
浅只复制了一层对象的属性，深复制递归复制了所有层级。
简单的浅复制实现：

var obj = { a:1, arr: [2,3] };
var shallowObj = shallowCopy(obj);

function shallowCopy(src) {
  var dst = {};
  for (var prop in src) {
    if (src.hasOwnProperty(prop)) {
      dst[prop] = src[prop];
    }
  }
  return dst;
}

因为浅复制只会将对象的各个属性进行依次复制，并不会进行递归复制，而 JavaScript 存储对象都是存地址的，所以浅复制会导致 obj.arr 和 shallowObj.arr 指向同一块内存地址。
导致的结果为：

shallowObj.arr[1] = 5;
obj.arr[1]   // = 5

而深复制则不同，它不仅将原对象的各个属性逐个复制出去，而且将原对象各个属性所包含的对象也依次采用深复制的方法递归复制到新对象上。这就不会存在上面 obj 和 shallowObj 的 arr 属性指向同一个对象的问题。

var obj = { a:1, arr: [1,2] };
var obj2 = deepCopy(obj);

需要注意的是，如果对象比较大，层级也比较多，深复制会带来性能上的问题。在遇到需要采用深复制的场景时，可以考虑有没有其他替代的方案。在实际的应用场景中，也是浅复制更为常用。

var cloneObj=function(obj){
        var str,newobj=obj.constructor===Array?[]:{};
        if (typeof obj!=='object') {
            return;
        }else if(window.JSON){
            str=JSON.stringfy(obj);
            newobj=JSON.parse(str);
        }else{
            for (var i=obj) {
                newobj[i]=typeof obj[i]==='object'?cloneObj(obj[i]):obj[i];
            }
        }
        return newobj;
    };

原地址：https://www.zhihu.com/question/23031215