概述

关于深拷贝还是浅拷贝，浅拷贝是指拷贝一层，深层次对象级别就只拷贝引用；深拷贝是每一层的数据都会拷贝出来。简单来说就是浅拷贝的时候如果数据是基本数据类型，那么就如同直接赋值那样，会拷贝其本身；
如果除了基本数据之外还有一层的对象，那么对于浅拷贝来说，就只能拷贝其引用。如果原对象的值发生了变化，那么这个结果不光会反映到原对象上，但是深拷贝就不一样，即使有嵌套关系依然会全部的拷贝出来。
下面上代码：实现浅拷贝的第一种方法

function simpleClone(initalObj) {
    var obj = {};
    for ( var i in initalObj) {
        obj[i] = initalObj[i];
    }
    return obj;
}
 
var obj = {
    a: "hello",
    b:{
        a: "world",
        b: 21
    },
    c:["Bob", "Tom", "Jenny"],
    d:function() {
        alert("hello world");
    }
};
var cloneObj = simpleClone(obj);
 
console.log(cloneObj.a);
console.log(cloneObj.b);
console.log(cloneObj.c);
console.log(cloneObj.d);
 
//更改原对象中的a,b,c,d，看看拷贝过来的对象是否变化
cloneObj.a = "changed";
cloneObj.b.a = "changed";
cloneObj.b.b = 25;
cloneObj.c = [1, 2, 3];
cloneObj.d = function() { alert("changed"); };
console.log(obj.a);    //hello
console.log(obj.b);    //{a:"changed",b:25},事实上就是只有对象是拷贝的引用类型
console.log(obj.c);    //['Bob','Tom','Jenny']
console.log(obj.d);    //...alert("hello world")

返回结果

var obj1 = {
    a: "hello",
    b: {
        a: "hello",
        b: 21}
};
 
var cloneObj1= Object.assign({}, obj1);
cloneObj1.a = "changed";
cloneObj1.b.a = "changed";
console.log(obj1.a);  //hello
console.log(obj.b.a); // "changed"

浅拷贝说完了，我们来看看如何才能实现深拷贝：
1.使用JSON数据解析来实现深拷贝。

            var obj1 = {
                a: 10,
                b: {
                    a: 'yf',
                    b: 'bl'
                },
                c: ['Bob','Tom','nick'],
                d: function(){
                    console.log('Hello World');
                }
            };
        function deepClone(obj){
            return JSON.parse(JSON.stringify(obj));
        }
        var e = deepClone(obj1);
        e.a = 20;
        console.log(e);
        console.log(obj1);
        // 通过类型检测判断JSON是不识别Function类型的
        console.log(typeof e.d);
        console.log(typeof obj1.d);

在使用JSON的时候要注意的是，使用JSON数据解析来实现深度拷贝(JSON不能够识别Function类型)；

输出结果

递归方法实现深度拷贝

    function deepClone(Obj1, Obj2) {    
            var obj = Obj2 || {};    
            for (var i in Obj1) {        
                var prop = Obj1[i]; 
                // 避免相互引用对象导致死循环，如initalObj.a = initalObj的情况
                if(prop === obj) {            
                continue;
            }        
            if (typeof prop === 'object') {
                obj[i] = (prop.constructor === Array) ? [] : {};            
                arguments.callee(prop, obj[i]);
            } else {
                obj[i] = prop;
            }
        }    
        return obj;
    }
    var str = {};
    var obj = { a: {a: "hello", b: 21, c: function(){alert('hello world');}}};
    deepClone(obj, str);
    console.log(str.a);

浏览器返回结果

通过上面的方法，我们补全了JSON不能对Function使用的缺点。

总结

浅拷贝就是两个对象引用的是同一个的内存空间，一个改变全部改变。
深拷贝就是两个对象，旧对象还是用原来的储存空间。但是新对象就不同了，新对象自己开辟了一个新的空间，自己对自己控制，不再受原来空间的限制。

参考

https://blog.csdn.net/rememberyf/article/details/82841224

文中如有错误，望读者斧正。共同学习，共同进步。