深拷贝和浅拷贝详细区别

浅拷贝

解释：只会拷贝最表面一层，深层次对象级别的只是引用

主要数据代码：

		
		var obj = {
            id: 8,
            name: '王值',
            age: {
                ages: 18
            },
            arr: [1, 5, 5, 7],
            fun: function () {
                console.log('o');
            }
        }
        var newobj = {}
		// for...in...方法
        for (var k in obj) {
            newobj[k] = obj[k]
        }
        
       newobj.fun = function () {
            console.log('oooooooo');
        }
        newobj.age.ages = 20
        console.log(obj);
        console.log(newobj);

        // es6: 语法糖
        Object.assign(newobj, obj)
        
        newobj.fun = function () {
            console.log('oooooooo');
        }
        newobj.age.ages = 20
        console.log(obj)
        console.log(newobj)
        

两种方法输出结果都为：

结论：因为浅拷贝深层次的数据都是引用，地址指向的是同一个，所以随意修改一个就会使两个数据一起改变

深拷贝

解释：拷贝多层数据，每一层都会拷贝

主要数据代码：

		var obj = {
            id: 8,
            name: '王值',
            age: {
                ages: 18
            },
            arr: [1, 5, 5, 7],
            fun: function () {
                console.log('o');
            }
        }
        var newobj = {}
        
		console.log(obj.fun instanceof Object) // true

		function deepCopy(newObj, oldObj) {
            for (var k in oldObj) {
                var item = oldObj[k]
                if (item instanceof Array) { // 因为数组属于对象所以要先判断
                    newObj[k] = []
                    deepCopy(newObj[k], item)
                } else if (item instanceof Function) { // 因为函数属于对象所以要先判断
                    newObj[k] = item
                } else if (item instanceof Object) {
                    newObj[k] = {}
                    deepCopy(newObj[k], item)
                } else {
                    newObj[k] = item
                }
            }
        }

        deepCopy(newobj, obj)

        obj.age.ages = 20
        console.log(obj)
        console.log(newobj)

        

输出结果为：
结论：因为深拷贝是拷贝把你数据拷贝像一个新的地址，所以所以不会因为你数据改变而改变

提示：函数属于对象，但是不是深层次对象,所以不会受深浅拷贝影响

 作者：jokerLzg5 
                               						    本文禁止转载