首页 > 其他分享 >深拷贝与浅拷贝一次弄通

深拷贝与浅拷贝一次弄通

时间:2022-11-09 00:01:17浏览次数:40  
标签:一次 console log 弄通 拷贝 o2 o1 classInfo

  • JavaScript中存在两大数据类型:
    基本类型
    引用类型

  • 基本类型数据保存在在栈内存中

  • 引用类型数据保存在堆内存中,引用数据类型的变量是一个指向堆内存中实际对象的引用,存在栈中

深浅拷贝的区别

先写一个对象,接下来我们浅\深拷贝这个对象

let o1 = {name:'zs',age:17,classInfo:{score:100}}

实现浅拷贝的两种方法

    // 第一个方法,for循环递归
    let o1 = {name:'zs',age:17,classInfo:{score:100}}
    let o2 = {}
    for(const k in o1){
        o2[k] = o1[k]
    }
    o2.name = 'ls'
    o2.classInfo.score = 12
    console.log('o2',o2)
    console.log('o1',o1)


    //第二个方法 使用Object.assign({},o1) 方法
    let o1 = { name: 'zs', age: 17, classInfo: { score: 100 } }
    let o2 = Object.assign({},o1)

    o2.name = 'ls'
    o2.classInfo.score = 12
    console.log('o2',o2)
    console.log('o1',o1)

实现深拷贝的两种方法

    //第一个方法,自己封装一个函数遍历判断循环到的元素是复杂数据类型还是简单数据类型,复杂数据类型的话就重新调用自己这个函数深层次拷贝,简单数据类型就直接拷贝
    function deep(copy, beicopy) {
        for (k in beicopy) {
            if (Object.prototype.toString.call(beicopy[k]) === '[object Object]') {
                copy[k] = {}
                deep(copy[k], beicopy[k])
            } else if (Object.prototype.toString.call(beicopy[k]) === '[object Array]') {
                copy[k] = []
                deep(copy[k],beicopy[k])
            }else{
                copy[k] = beicopy[k]
            }
        }
    }
    deep(o2,o1)
    o2.name = 'ls'
    o2.classInfo.score = 12
    console.log('o2',o2)
    console.log('o1',o1)

    //第二个方法,直接将JavaScript值转成json字符串再转回JavaScript值
    //注意:::该方法不可以拷贝函数和undefined值
    let str = JSON.stringify(o1)
    let o2  = JSON.parse(str)
    o2.name = 'ls'
    o2.classInfo.score = 12
    console.log('o2',o2)
    console.log('o1',o1)

标签:一次,console,log,弄通,拷贝,o2,o1,classInfo
From: https://www.cnblogs.com/maxiaohu/p/16871745.html

相关文章

  • 第一次实验题目
    1.题目:最大连续子数组和(最大子段和)问题:给定n个整数(可能为负数)组成的序列a[1],a[2],a[3],…,a[n],求该序列如a[i]+a[i+1]+…+a[j]的子段和的最大值。当所给的整数均为负数......
  • github第一次上传代码
    gitpush-uoriginmain时提示fatal:repository'https://github.com/'notfound:1、在第一次关联github仓库的时候不要选https,选ssh的连接。如果你已经选了https了,那可......
  • 记一次无法访问到静态页面
       <=    =>      很久没有写博客了这次写是因为碰到了卡我一个小时的问题,如图,静态资源一致不能访问,后来我尝试用了另一种方式   就是......
  • day26 Vue相关内容及深拷贝和浅拷贝
    Vue相关内容概述:Vue是前端的一个Js库(诞生于2015年,兴起于2016年,尤雨溪写的(目前是阿里巴巴在维护)),vue是MVVM模式的框架.MVVM概述:model数据v......
  • 记录一次上个月27号晚上元空间内存溢出
    这次是测试环境,处理问题的时间比较充裕。同样和之前堆内存溢出一样,arthasattachfailure。不同的是这次attach过程报错显示OutOfMemoryError:Metaspace。随即想......
  • 创建型设计模式-原型模式(深拷贝,浅拷贝)
    Person类:publicclassPerson{publicstringName{get;set;}publicintAge{get;set;}publicAddressAddress{get;set;......
  • 记一次安卓认领签名
    前展:长期没有更新上传应用apk,遭遇安卓应用平台的封杀【下架】,需要认领应用!认领应用步骤:平台会提供一个需要签名的空的安装包!OppoSignVerify.apk文件和一个签名说明帮助......
  • 编写成功的椭圆latex底稿,可以直接拷贝。注意文章中有图片ellipse.png需要复制到文章所
    %注意,本文为了在数学公式中使用中文,调用了xeCJKsetup{CJKmath}所以,不能用pdfLatex编译器,要用Xelatex编译器,否则报错。即,在编译器左上角的绿色箭头右侧下拉框里,选择Xelatex.......
  • 记录因Sharding Jdbc批量操作引发的一次fullGC
    周五晚上告警群突然收到了一条告警消息,点开一看,应用fullGC了。于是赶紧联系运维下载堆内存快照,进行分析。内存分析使用MemoryAnalyzer打开堆文件mat下载地址:htt......
  • 死磕Java面试系列:深拷贝与浅拷贝的实现原理
    深拷贝与浅拷贝的问题,也是面试中的常客。虽然大家都知道两者表现形式不同点在哪里,但是很少去深究其底层原理,也不知道怎么才能优雅的实现一个深拷贝。其实工作中也常常需要......