JS使用JSON.parse(),JSON.stringify()实现对对象的深拷贝功能分析


Posted in Javascript onMarch 06, 2019

本文实例讲述了JS使用JSON.parse(),JSON.stringify()实现对对象的深拷贝功能。分享给大家供大家参考,具体如下:

根据不包含引用对象的普通数组深拷贝得到启发,不拷贝引用对象,拷贝一个字符串会新辟一个新的存储地址,这样就切断了引用对象的指针联系。

测试例子:

var test={
  a:"ss",
  b:"dd",
  c:[
    {dd:"css",ee:"cdd"},
    {mm:"ff",nn:"ee"}
  ]
};
var test1 = JSON.parse(JSON.stringify(test));//拷贝数组,注意这行的拷贝方法
console.log(test);
console.log(test1);
test1.c[0].dd="change"; //改变test1的c属性对象的d属性
console.log(test); //不影响test
console.log(test1);

测试结果:

JS使用JSON.parse(),JSON.stringify()实现对对象的深拷贝功能分析

根据测试结果,我们可以看到,test1已经从test复制一份,并且test1改变其中属性的值时,对原来的对象test没有造成影响。

JSON.parse(),JSON.stringify()兼容性问题

可以通过为IE7以及IE7以下版本的IE浏览器引入json2.js,使用json2.js来解决JSON的兼容性问题

<!--[if lt IE 7]>
<script src="具体放路径/json2.js"></script> 
<![endif]-->

json2.js的github地址为:https://github.com/douglascrockford/JSON-js

好了,到这里就实现了,使用JSON.parse(),JSON.stringify()对对象的深拷贝~~

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

更多关于JavaScript相关内容可查看本站专题:《javascript面向对象入门教程》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
jQuery中Dom的基本操作小结
Jan 23 Javascript
Jquery对象和Dom对象的区别分析
Nov 20 Javascript
javascript每日必学之循环
Feb 19 Javascript
JS获取中文拼音首字母并通过拼音首字母快速查找页面内对应中文内容的方法【附demo源码】
Aug 19 Javascript
JS 终止执行的实现方法
Nov 24 Javascript
JavaScript实现动态添加、移除元素或属性的方法分析
Jan 03 Javascript
ES6 迭代器与可迭代对象的实现
Feb 11 Javascript
说说如何使用Vuex进行状态管理(小结)
Apr 14 Javascript
JS块级作用域和私有变量实例分析
May 11 Javascript
小程序接入腾讯位置服务的详细流程
Mar 03 Javascript
使用JavaScript获取Django模板指定键值数据
May 27 Javascript
vue + el-form 实现的多层循环表单验证
Nov 25 Vue.js
jQuery使用$.extend(true,object1, object2);实现深拷贝对象的方法分析
Mar 06 #jQuery
微信小程序利用swiper+css实现购物车商品删除功能
Mar 06 #Javascript
JS实现数组深拷贝的方法分析
Mar 06 #Javascript
node.js中ws模块创建服务端和客户端,网页WebSocket客户端
Mar 06 #Javascript
node.js中express模块创建服务器和http模块客户端发请求
Mar 06 #Javascript
微信小程序性能优化之checkSession的使用
Mar 06 #Javascript
详解在微信小程序的JS脚本中使用Promise来优化函数处理
Mar 06 #Javascript
You might like
关于PHP实现异步操作的研究
2013/02/03 PHP
Thinkphp5结合layer弹窗定制操作结果页面
2017/07/07 PHP
JavaScript 设计模式之组合模式解析
2010/04/09 Javascript
下载网站打开页面后间隔多少时间才显示下载链接地址的代码
2010/04/25 Javascript
Javascript无阻塞加载具体方式
2013/06/28 Javascript
JQuery调用WebServices的方法和4个实例
2014/05/06 Javascript
jQuery实现平滑滚动页面到指定锚点链接的方法
2015/07/15 Javascript
高效利用Angular中内置服务$http、$location等
2016/03/22 Javascript
动态设置form表单的action属性的值的简单方法
2016/05/25 Javascript
移动开发之自适应手机屏幕宽度
2016/11/23 Javascript
Jquery Easyui验证组件ValidateBox使用详解(20)
2016/12/18 Javascript
JavaScript中String对象的方法介绍
2017/01/04 Javascript
关于foreach循环中遇到的问题小结
2017/05/08 Javascript
为输入框加入数字js校验代码分享
2017/11/02 Javascript
vue iView 上传组件之手动上传功能
2018/03/16 Javascript
vue init webpack 建vue项目报错的解决方法
2018/09/29 Javascript
浅谈webpack+react多页面开发终极架构
2018/11/11 Javascript
[04:09]2018年度DOTA2社区贡献奖-完美盛典
2018/12/16 DOTA
Python过滤函数filter()使用自定义函数过滤序列实例
2014/08/26 Python
Python中单例模式总结
2018/02/20 Python
Tensorflow使用支持向量机拟合线性回归
2018/09/07 Python
Python Web版语音合成实例详解
2019/07/16 Python
Python模拟登录之滑块验证码的破解(实例代码)
2019/11/18 Python
python实现人像动漫化的示例代码
2020/05/17 Python
美国大城市最热门旅游景点门票:CityPASS
2016/12/16 全球购物
巴西24小时在线药房:Droga Raia
2020/05/12 全球购物
捷克建筑材料网上商店:DEK.cz
2021/03/06 全球购物
初三班主任寄语大全
2014/04/04 职场文书
2014年社会实践活动总结范文
2014/04/29 职场文书
学习保证书范文
2014/04/30 职场文书
最美乡村医生事迹材料
2014/06/02 职场文书
公司总经理任命书
2014/06/05 职场文书
2015年超市工作总结
2015/04/09 职场文书
小学体育队列队形教学反思
2016/02/16 职场文书
python随机打印成绩排名表
2021/06/23 Python
Python利用capstone实现反汇编
2022/04/06 Python