zoukankan      html  css  js  c++  java
  • js数组中的引用类型

    我们看一下这个例子:

    let a={tile:'深复制'};  
    let b=a;  
    a.title='浅复制';  

    那么我们会获得两个对象,一个a,一个b,a的title是浅复制,b的title是深复制。
    但结果真是这样吗?

    我们console.log一下

     

     为啥两个都是输出"浅复制"。。。。

    其实,a,b是共用同一个地址,所以虽然看起来是两个对象,其实就是一个对象,a===b,这就是深复制,复制的不仅仅是数据,而且连地址一起复制过来了,相当于Windows的快捷方式,表面上看起来一个在C盘,一个在D盘,其实都是一个文件。

    那么,如果我们仅仅想复制”深复制“这三个字呢?a的title和b的title要不同,我们如何来做。

    let a={title:'深复制'};  
    let b={...a,content:"一个教程"};  
    a.title='浅复制';  
    console.log(a.title);  
    console.log(b.title);  

    我们再来看打印结果

    这样我们虽然复制了a的所有数据,但是a和b是不同的对象,更改任意一个的数据,不会影响到第二个,而且b还可以对a 进行拓展,比如加了content一个字段。

    添加一个字段很烦?那再来说说这个

    let a=[1,23];  
    let b=[...a];  
    b[1]=32;
    console.log(a);   //[1, 23]
    console.log(b);  //[1, 32]

    看到了么?ES6的剩余参数也可以直接做到深复制,完全不需要添加字段或者数组a.concat('')来进行复制

    更新,上面这个不对,往下看

    let a =[{a:1}]
    let b = JSON.parse(JSON.stringify(a))
    b[0].a=3
    
    consloe.log(a[0].a)  // 1

    用json转才可以完成深赋值,因为字符串转成对象之后就是一个新的对象了;

  • 相关阅读:
    MAC OS 快捷键一览
    JavaScript检测实例属性, 原型属性
    jQuery $.each用法
    双击和单击事件冲突解决方法
    移动WEB前端开发资源整合
    纯CSS3实现自定义涂鸦风格的边框
    jquery如何阻止子元素相应mouseout事件
    jquery键盘事件全记录
    javascript类型系统之基本数据类型与包装类型
    经验分享:CSS浮动(float,clear)通俗讲解
  • 原文地址:https://www.cnblogs.com/nxzblogs/p/11773239.html
Copyright © 2011-2022 走看看