深拷贝和浅拷贝

首先，对于深拷贝和浅拷贝了解一波

let obj3 = {}
let obj1={
      name:'grace',
      car:{
        brand:'小黄车',
        price: 200
      }};
//通过for in 遍历对象，拷贝了数据存到obj3中
    for(var k in obj1){
       obj3[k] = obj1[k]
    }
//obj3修改car中的price属性的值
 obj3.car.price = '1'

console.log(obj1) 
console.log(obj3)

上述代码执行后，会发现obj1和obj3中的car.price都被修改成1了，此时就涉及到了深拷贝

浅拷贝和深拷贝的理解

浅拷贝:只会拷贝一层，如果全是简单类型的属性，不会有问题，但如果存在复杂数据类型，其实际拷贝的是内存地址，这样存在问题，此时我们就需要深拷贝

 

实现深拷贝的方法

1.递归函数

function deepCopy(obj) {
      let newObj = {}
      for (var k in obj) {
        newObj[k] = typeof obj[k] === 'object' ? deepCopy(obj[k]) : obj[k]
      }
      return newObj
    }

let obj1 = {
      name: 'grace',
      car: {
        brand: '小黄车',
        price: 200
      }
    }

let  obj2 = deepCopy(obj1)

obj2.car.price = 10

console.log(obj1)
console.log(obj2)

 

2.JSON.parse和JSON.stringify方法

let obj1={
      name:'grace',
      car:{
        brand:'小黄车',
        price: 200
      }}
    let obj2 = JSON.parse(JSON.stringify(obj1))
//此时修改了obj2中的数据
    obj2.car.price = '400'

    console.log(obj1)
    console.log(obj2)

最终打印结果就会发现只有obj2中的数据发生变化

3.jquery中的$.extend方法

  //$.extend(deep,target,obj) 
     let  obj4 = {}
    let obj1={
      name:'grace',
      car:{
        brand:'小黄车',
        price: 200
      }}
$.extend(true,obj4,obj1)

obj4.car.brand = 'bike'

console.log(obj1)
console.log(obj4)

最终结果是只有obj4中的car.brand变成了bike