数据拷贝在开发中经常会使用到，通过对数据的拷贝进行数据的处理。

在前端开发中数据拷贝分为深拷贝和浅拷贝，浅拷贝适用于简单的对象或数组，而深拷贝适用于复杂的对象或数组，特别是包含嵌套对象或数组的情况。

本篇文章就来详细介绍关于数据的深拷贝和浅拷贝差异及操作。

    浅拷贝：即创建一个新的对象或数组，新对象或数组的元素是原对象或数组的引用。故，当我们修改新对象或数组的元素时，原对象或数组的对应元素也会被修改。

    深拷贝：即指创建一个新的对象或数组，新对象或数组的元素是原对象或数组的副本。故，当我们修改新对象或数组的元素时，原对象或数组的对应元素不会被修改。

浅拷贝操作：

let array = [ 1 , 2 , 3 , 4 ]
let obj = {a:'1' , b:'2' , c:'3' }
let cloneArray = array
let cloneObj = obj
console.log(cloneArray) // [ 1 , 2 , 3 , 4 ]
console.log(cloneObj) // {a:'1' , b:'2' , c:'3' }
array.push(5)
obj.d = '4'
console.log(cloneArray) // [1, 2, 3, 4, 5]
console.log(cloneObj) //{a: "1", b: "2", c: "3", d: '4'}

浅拷贝，只是复制了堆地址。

深拷贝操作：

function deepClone(source){
  let targetObj = source.constructor === Array ? [] : {}; // 判断复制的目标是数组还是对象
  for(let keys in source){ // 遍历目标
    if(source.hasOwnProperty(keys)){//因为for in 会访问到原型上的东西，所以这里使用hasOwnProperty
      if(source[keys] && typeof source[keys] === 'object'){ // 如果值是对象，就递归一下
        targetObj[keys] = source[keys].constructor === Array ? [] : {};
        targetObj[keys] = deepClone(source[keys]);
      }else{ // 如果不是，就直接赋值
        targetObj[keys] = source[keys];
      }
    } 
  }
  return targetObj;
}

深拷贝不是像浅拷贝一般，只会拷贝堆地址的引用，而会复制其键值。其实现的方式有两种简单的方法。

    1.使用JSON对象的parse与stringify方法。

    2.使用递归函数