深拷贝和浅拷贝

文章目录

    • 深浅拷贝
        • 浅拷贝
        • 深拷贝

深浅拷贝

    var obj ={
      id:1,
      name:'mkbird',
      msg:{
        age:18
      },
      fn:function(){
        console.log('123');
      }
    }

浅拷贝

浅拷贝只拷贝一层,更深层次对象级别的只拷贝引用(即地址)

    // 浅拷贝(方法一)
	// 使用es6新增语法糖Object.assign(newObj,old0bj)
    const newObj={}
    Object.assign(newObj,obj)
    // newObj.msg赋过来的是地址,修改新的,旧的也会变
    newObj.msg.age=20
    console.log(obj.msg.age); // 20
    // 浅拷贝(方法二)
    // 手动遍历赋值
    var newObj={}
    function shallowCopy(newObj,oldObj){
      for(var k in oldObj){
        newObj[k] = oldObj[k]
      }
    }
    shallowCopy(newObj,obj)

深拷贝

深拷贝相当于完全拷贝了一份一模一样的对象

实现方法:在浅拷贝的基础上,创建一个中间值获取属性值,判断每一个中间值的数据类型,在新对象上创建对应的数据类型,递归自己将item放入

    // 深拷贝
    function deepCopy(newObj,oldObj){
      for(var k in oldObj){
        // 1.获取元素属性
        var item = oldObj[k]
        // 2.判断属性是否为数组
        if(item instanceof Array){
          newObj[k] = []
          deepCopy(newObj[k],item)
          // 3.判断属性是否为数组
        }else if(item instanceof Object){
          newObj[k]= {}
          deepCopy(newObj[k],item)
          // 4.属性可以直接赋值
        }else{
          newObj[k]=item
        }
      }
    }
    var newObj={}
    deepCopy(newObj,obj)

你可能感兴趣的:(前端,#,JavaScript,前端,javascript)