javascript的深拷贝和浅拷贝主要是针对像Object, Array这样的复杂对象的，简单理解为浅拷贝只复制一层对象的属性，而深拷贝则递归复制了所有层级。  

下面是一个简单的浅拷贝实现： 

<script>
var obj = {
    name : 'tony',
    infor:[1,2],
};
var obj1 = {};
for (var i in obj) {
    obj1[i] = obj[i];
}

console.log(obj); //Object {name: "tony", infor: Array[2]}
obj1['infor'].push(3);
console.log(obj); //Object {name: "tony", infor: Array[3]}
console.log(obj1); //Object {name: "tony", infor: Array[3]}
console.log(obj1['infor']);//[1, 2, 3]
console.log(obj['infor']);//[1, 2, 3]
console.log(obj['infor'] === obj1['infor']);//true
</script>

从输出我们可以看出，当我们在obj1中的infor添加属性，取发现在obj中同样添加了。这就是因为浅拷贝对于属性是对象的时候，只是进行简单的地址拷贝，其引用关系也在；浅拷贝只有当单独修改第一层对属性的时候才不会相互修改，如：

obj1.name="haha"
console.log(obj1.name);//输出haha
console.log(obj);//输出tony

在来看下深拷贝的实现：

<script>
function inCopy(obj1,obj2){
    var obj1 = obj1 || {};
    for (var i in obj2) { 
        if(obj2.hasOwnProperty(i)){ //只拷贝实例属性，不进行原型的拷贝
            if(typeof obj2[i] == 'object') { //引用类型的数据单独处理
                obj1[i] = Array.isArray(obj2[i])?[]:{};
                inCopy(obj1[i],obj2[i]); //递归处理引用类型数据
            }else{
                obj1[i] = obj2[i]; //值类型的数据直接进行拷贝
            }
        }
    }
}
var obj = {
    name : 'tony',
    infor:[1,2],
};
var obj1 = {};
inCopy(obj1,obj);//深拷贝

console.log(obj); //Object {name: "tony", infor: Array[2]}
obj1['infor'].push(3);
console.log(obj); //Object {name: "tony", infor: Array[2]}
console.log(obj1); //Object {name: "tony", infor: Array[3]}
console.log(obj1['infor']);//[1, 2, 3]
console.log(obj['infor']);//[1, 2]
</script>

可以看出深拷贝对两者之间的改变是互不影响的，它不仅将原对象的各个属性逐个复制出去，而且将原对象各个属性所包含的对象也依次采用深复制的方法递归复制到新对象上。这就不会存在上面 obj 和 obj1 的 infor属性指向同一个对象的问题。

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

本文内容仅供个人学习、研究或参考使用，不构成任何形式的决策建议、专业指导或法律依据。未经授权，禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载，请保留原文来源信息，不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持！

链接: https://fly63.com/article/detial/194