最新公告
  • 欢迎您光临起源地模板网,本站秉承服务宗旨 履行“站长”责任,销售只是起点 服务永无止境!立即加入钻石VIP
  • 嵌套数组对象结构的深度复制踩坑

    正文概述 掘金(困难)   2021-07-30   468

    背景

    • 一个简易的临时用的填信息的表单放在本地静态html网页上,数据也作为变量储存在script标签中,直接发html给对方填写后用cdn的FileSaver.js生成处理好格式的json文件,我就收集这个文件直接扔给脚本去读。(主要还是这是个全新的项目,什么服务器数据库的都没有搞,数据暂时要我手输,所以趁着有空写了个小程序把工作量分给收集客户信息的人,我就只用收能直接丢给脚本批量处理的半成品)

    • 方便起见直接要求一个人有多个手机要填的将两个号码之间用空格分隔写在同一个input中。

    • 收集好的数据在生成文件前处理好格式, 手机字段 要分割成数组元素

    • 即数据是以下结构

    //原
    let origin=[
    	{
    		name:'xx',
    		phone:'xx xx'
    	},
    	....
    ]
    
    //修改后
    let update=[
    	{
    		name:'xx',
    		phone:['xx','xx']
    	},
    	....
    ]
    

    问题发现

    • **想当然地用了slice来深度拷贝,**然后发现第一次生成文件可以正常,不刷新页面再点击生成就会报错
    • 打印后发现 原数据的phone也被修改成了数组的形式,所以没法再次处理,报错

    一度以为自己记错了slice不能深度复制,又用concat之类的方法试了试,发现都不行

    • 最后新开了个js文件试了试才发现是 嵌套结构的锅

    问题解决

    知道原因了就好办了,只要解决嵌套结构的深度复制就好了。

    选择了最简单的方法:JSON.parse(JSON.stringify(origin))

    • 注意!JSON方法深拷贝虽然可以轻松解决嵌套问题,但也是有弊端的

    JSON方法深拷贝的缺点

    网上找到的深拷贝方法,不过我这就是个临时用来减轻重复劳动的一次性东西,内容也只有字符串,所以就懒得弄了。

    终究还是知识点不扎实才出了这样的问题啊。。。


    起源地下载网 » 嵌套数组对象结构的深度复制踩坑

    常见问题FAQ

    免费下载或者VIP会员专享资源能否直接商用?
    本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP介绍。
    提示下载完但解压或打开不了?
    最常见的情况是下载不完整: 可对比下载完压缩包的与网盘上的容量,若小于网盘提示的容量则是这个原因。这是浏览器下载的bug,建议用百度网盘软件或迅雷下载。若排除这种情况,可在对应资源底部留言,或 联络我们.。
    找不到素材资源介绍文章里的示例图片?
    对于PPT,KEY,Mockups,APP,网页模版等类型的素材,文章内用于介绍的图片通常并不包含在对应可供下载素材包内。这些相关商业图片需另外购买,且本站不负责(也没有办法)找到出处。 同样地一些字体文件也是这种情况,但部分素材会在素材包内有一份字体下载链接清单。
    模板不会安装或需要功能定制以及二次开发?
    请QQ联系我们

    发表评论

    还没有评论,快来抢沙发吧!

    如需帝国cms功能定制以及二次开发请联系我们

    联系作者

    请选择支付方式

    ×
    迅虎支付宝
    迅虎微信
    支付宝当面付
    余额支付
    ×
    微信扫码支付 0 元