• JS对象的引用,对象的拷贝


    一、场景

    除了基本类型跟null,对象之间的赋值,只是将地址指向同一个,而不是真正意义上的拷贝

    将一个对象赋值给另外一个对象。

    var a = [1,2,3];
    var b = a;
    b.push(4); // b中添加了一个4
    alert(a); // a变成了[1,2,3,4] 

    自定义对象

    var obj = {a:10};
    var obj2 = obj;
    obj2.a = 20; // obj2.a改变了,
    alert(obj.a); // 20,obj的a跟着改变  

    这就是由于对象类型直接赋值,只是将引用指向同一个地址,导致修改了obj会导致obj2也被修改

    二、浅拷贝

    所以,我们需要封装一个函数,来对对象进行拷贝,通过for in 循环获取基本类型,赋值每一个基本类型,才能真正意义上的复制一个对象

    var obj = {a:10};
    function copy(obj){
        var newobj = {};
        for ( var attr in obj) {
            newobj[attr] = obj[attr];
        }
        return newobj;
    }
    var obj2 = copy(obj);
    obj2.a = 20;
    alert(obj.a); //10  

    这样就解决了对象赋值的问题。

    三、深拷贝

    但是这里存在隐患,如果obj中,a的值不是10,而是一个对象,这样就会导致在for in中,将a这个对象的引用赋值为新对象,导致存在对象引用的问题。

    var obj = {a:{b:10}};
    function copy(obj){
        var newobj = {};
        for ( var attr in obj) {
            newobj[attr] = obj[attr];
        }
        return newobj;
    }
    var obj2 = copy(obj);
    obj2.a.b = 20;
    alert(obj.a.b); //20  

    因此,由于这个copy对象只是对第一层进行拷贝,无法拷贝深层的对象,这个copy为浅拷贝,我们需要通过递归,来拷贝深层的对象。将copy改造成递归即可

    var obj = {a:{b:10}};
    function deepCopy(obj){
        if(typeof obj != 'object'){
            return obj;
        }
        var newobj = {};
        for ( var attr in obj) {
            newobj[attr] = deepCopy(obj[attr]);
        }
        return newobj;
    }
    var obj2 = deepCopy(obj);
    obj2.a.b = 20;
    alert(obj.a.b); //10 
     
     
  • 相关阅读:
    Spring中bean的scope详解
    【转】Servlet生命周期
    layui切换子页面销毁定时器,切换页面失效
    工具记录 [部分摘抄 , 持续更新记录中]
    常用js对dom操作的分装[摘抄记录中....]
    常用js函数的封装集合,更新中...
    360安全浏览器的兼容显示页面
    关于浏览器弹出拦截窗口
    电脑连接小米盒子测试App记录
    面试 & 学习网址记录
  • 原文地址:https://www.cnblogs.com/jdsm/p/9913408.html
Copyright © 2020-2023  润新知