js中复杂数据类型(对象)的三大混淆点——赋值,浅拷贝,深拷贝

1.赋值的概念: (文字一定要在脑子里深深咀嚼)

当我们把一个对象赋值给一个新的变量的时候,赋的其实是该对象在栈中的地址而不是堆中的数据,也就是两个对象指向的是同一个存储空间,无论哪个对象发生改变,其实都是改变存储空间的内容,因此,两个对象是联动的

let obj = {
    name:'nn',
    hobbies:['唱歌','跳舞']
}
let objOne = obj
console.log(obj)
console.log(objOne )
//打印这两个值总是一样的

2.浅拷贝的概念: (文字一定要在脑子里深深咀嚼)

重新在堆中创建内存,拷贝前后对象的基本数据类型互不影响,但拷贝前后对象的引用类型因共享一块内存会相互影响

function shallowCopy(obj) {
   let target = {} //新创建的对象
   for(let i in obj) {
      if(obj.hasOwnProperty(i)) {
          target[i] = obj[i]
      }
    }
      return target
  }

3.深拷贝的概念: (文字一定要在脑子里深深咀嚼)

从堆内存中开辟一个新的区域存放对象,对对象中的子对象进行递归拷贝,拷贝前后的两个对象互不影响

function deepCopy(obj) {
    let clone = {}
    if(obj === null) return obj
    if(obj instance Date) return new Date(obj)
    if(obj instance RegExp) return new RegExp(obj)
    if(typeof obj != 'object') return obj
    for (var i in obj) {
        if (obj.hasOwnProperty(i)) {
            clone[i] = deepCopy(obj[i]) //递归调用
        }
    }
    return clone
}
posted @ 2020-11-20 18:48  君归何时  阅读(372)  评论(0)    收藏  举报