浅拷贝 VS 深拷贝，并且手写一个深拷贝（深克隆）

其实深拷贝和浅拷贝都是针对的引用类型，JS中的变量类型分为值类型（基本类型）和引用类型；对值类型进行复制操作会对值进行一份拷贝，而对引用类型赋值，则会进行地址的拷贝，最终两个变量指向同一份数据，此时如果对其中一个进行修改，就会影响到另外一个。

根据拷贝的层级不同可以分为浅拷贝和深拷贝，浅拷贝就是只进行一层拷贝，深拷贝就是无限层级拷贝。

浅拷贝

• 实现原理就是遍历对象属性
• 实现方式其实很简单：
  1. slice()
  2. concat()
  3. Object.assign(target, …sources)
  4. ES6 扩展运算符 {…obj} 和 […arr]
  5. 循坏push

深拷贝

• 实现原理可以就是浅拷贝 + 递归。
• 实现方式：
  • JSON.parse(JSON.stringify(obj));

使用 JSON.parse 来实现一个深拷贝

let test = {
	x : 1,
	y : 2,
	z : {
		a : 4,
		b : 5
	}
}
// 深拷贝
let result = JSON.parse(JSON.stringify(test));
// 改变拷贝后的值
result.z.a = 40;
console.log(test);
console.log(result);

手写实现深拷贝

function deepClone(obj){
    let cloneObj;
    // 判断当输入的数据是简单数据类型时，直接复制
    if(obj && typeof obj !== 'object'){
        cloneObj = obj;
    }
    // 当输入的数据是对象或者数组时
    else if(obj && typeof obj === 'object'){
        // 检测输入的数据是数组还是对象
        cloneObj = Array.isArray(obj) ? [] : {};

        // 变量数据对象
        for(let key in obj){
            // 判断对象是否存在key属性
            if(obj.hasOwnProperty(key)){
                if(obj[key] && typeof obj[key] === 'object'){
                    // 若当前元素类型为对象时，递归调用
                    cloneObj[key] = deepClone(obj[key]);
                }
                // 若当前元素类型为基本数据类型
                else{
                    cloneObj[key] = obj[key];
                }
            }
        }
    }
    return cloneObj;
}

// 测试用例
deepClone({
  x: 1,
  y: [ 5, 6, 7 ],
  z: {
    a: 0,
    b: 1
  }
})

---

测试发现两种效果是一样的，深拷贝完成。