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 相关文章推荐
JavaScript 内置对象属性及方法集合
Jul 04 Javascript
jQuery实战之品牌展示列表效果
Apr 10 Javascript
js获取元素相对窗口位置的实现代码
Sep 28 Javascript
js实现横向伸展开的二级导航菜单代码
Aug 28 Javascript
JS原型、原型链深入理解
Feb 27 Javascript
Bootstrap~多级导航(级联导航)的实现效果【附代码】
Mar 08 Javascript
去除字符串左右两边的空格(实现代码)
May 12 Javascript
手机软键盘弹出时影响布局的解决方法
Dec 15 Javascript
AngularJS constant和value区别详解
Feb 28 Javascript
在ES5与ES6环境下处理函数默认参数的实现方法
May 13 Javascript
基于webpack4.X从零搭建React脚手架的方法步骤
Dec 23 Javascript
JavaScript代码实现微博批量取消关注功能
Feb 05 Javascript
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
JS中encodeURIComponent函数用php解码的代码
2012/03/01 PHP
PHP使用静态方法的几个注意事项
2014/09/16 PHP
Zend Framework实现Zend_View集成Smarty模板系统的方法
2016/03/05 PHP
创建无限极分类树型结构的简单方法
2017/06/20 PHP
IE与Firefox下javascript getyear年份的兼容性写法
2007/12/20 Javascript
Jquery插件写法笔记整理
2012/09/06 Javascript
JavaScript二维数组实现的省市联动菜单
2014/05/08 Javascript
JavaScript中的Math.E属性使用详解
2015/06/12 Javascript
jquery操作ID带有变量的节点实例
2016/12/07 Javascript
详解vue-cli本地环境API代理设置和解决跨域
2017/09/05 Javascript
旺旺在线客服代码 旺旺客服代码生成器
2018/01/09 Javascript
原生JavaScript实现remove()和recover()功能示例
2018/07/24 Javascript
HTML+JS实现“代码雨”效果源码(黑客帝国文字下落效果)
2020/03/17 Javascript
如何在Express4.x中愉快地使用async的方法
2020/11/18 Javascript
[54:29]2018DOTA2亚洲邀请赛 4.7 淘汰赛 VP vs LGD 第二场
2018/04/09 DOTA
在Python中封装GObject模块进行图形化程序编程的教程
2015/04/14 Python
Python中遇到的小问题及解决方法汇总
2017/01/11 Python
详解Python中的Numpy、SciPy、MatPlotLib安装与配置
2017/11/17 Python
Python基于OpenCV实现视频的人脸检测
2018/01/23 Python
numpy.random.seed()的使用实例解析
2018/02/03 Python
python执行CMD指令,并获取返回的方法
2018/12/19 Python
Python 旋转打印各种矩形的方法
2019/07/09 Python
Django单元测试工具test client使用详解
2019/08/02 Python
PyCharm更改字体和界面样式的方法步骤
2019/09/27 Python
浅析PEP570新语法: 只接受位置参数
2019/10/15 Python
python网络编程:socketserver的基本使用方法实例分析
2020/04/09 Python
keras中epoch,batch,loss,val_loss用法说明
2020/07/02 Python
非常详细的C#面试题集
2016/07/13 面试题
浅谈react路由传参的几种方式
2021/03/23 Javascript
班组拓展活动方案
2014/08/14 职场文书
县人大领导班子四风对照检查材料思想汇报
2014/10/09 职场文书
交通肇事罪辩护词
2015/05/21 职场文书
高中运动会前导词
2015/07/20 职场文书
2016年教师师德师风心得体会
2016/01/12 职场文书
告诉你一个秘密:富人致富的五大优点
2019/07/11 职场文书
windows server2012 R2下安装PaddleOCR服务的的详细步骤
2022/09/23 Servers