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

 更新时间:2019年03月06日 11:50:28   作者:白杨-M  
这篇文章主要介绍了JS使用JSON.parse(),JSON.stringify()实现对对象的深拷贝功能,结合实例形式分析了JSON.parse()与JSON.stringify()方法实现深拷贝的相关实现技巧与操作注意事项,需要的朋友可以参考下

本文实例讲述了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);

测试结果:

根据测试结果,我们可以看到,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.jb51.net/code/HtmlJsRun测试上述代码运行效果。

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

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

相关文章

  • Javascript URI 解析介绍

    Javascript URI 解析介绍

    这篇文章主要介绍了Javascript URI 解析介绍,本文直接给出代码示例,需要的朋友可以参考下
    2015-03-03
  • javascript 利用arguments实现可变长参数

    javascript 利用arguments实现可变长参数

    在C#中,有可变长参数params[],但是在js中,如何实现这种可变参数呢?本片文章主要介绍利用arguments,实现可变长参数。有需要的请参考下
    2016-11-11
  • javascript学习笔记之函数定义

    javascript学习笔记之函数定义

    本文主要给大家介绍了javascript的一些函数定义方面的基础知识,包括函数声明式、函数表达式、Function 构造函数等,十分的简单实用,有需要的小伙伴可以参考下。
    2015-06-06
  • JavaScript实现文本转语音功能的完整步骤

    JavaScript实现文本转语音功能的完整步骤

    这篇文章主要介绍了如何使用JavaScript和WebSpeechAPI快速实现一个简单的文本转语音Web应用,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2025-02-02
  • JavaScript实现动态表格的方法详解

    JavaScript实现动态表格的方法详解

    这篇文章主要为大家介绍了JavaScript实现动态表格的方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能够给你带来帮助
    2022-01-01
  • javascript基于DOM实现省市级联下拉框的方法

    javascript基于DOM实现省市级联下拉框的方法

    这篇文章主要介绍了javascript基于DOM实现省市级联下拉框的方法,可实现选择省份后出现对应城市下拉框选项的功能,非常具有实用价值,需要的朋友可以参考下
    2015-05-05
  • JS实现动态生成表格并提交表格数据向后端

    JS实现动态生成表格并提交表格数据向后端

    这篇文章主要为大家详细介绍了JS实现动态生成表格并提交表格数据向后端的相关资料,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-01-01
  • JavaScript模板引擎EJS特性及用法详解

    JavaScript模板引擎EJS特性及用法详解

    EJS是一种简单而灵活的模板引擎,用于将数据动态渲染到网页上,本文将从介绍EJS的背景和起源开始,详细介绍EJS的特性和使用方法,包括安装配置、基本语法和标签、数据绑定和逻辑控制、模板的继承和包含等方面,感兴趣的同学跟着小编一起来学习吧
    2023-06-06
  • 详解webpack分包及异步加载套路

    详解webpack分包及异步加载套路

    本篇文章主要介绍了详解webpack分包及异步加载套路,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-06-06
  • JS变量提升原理与用法实例浅析

    JS变量提升原理与用法实例浅析

    这篇文章主要介绍了JS变量提升,结合实例形式分析了JS变量提升基本概念、功能、原理、用法及相关注意事项,需要的朋友可以参考下
    2020-05-05

最新评论