js实现数组、对象深度克隆的两种办法
1.深度克隆的原理
JS中的深度克隆,指的是原对象改变了,克隆出来的新对象也不会改变,原对象与新对象是完全独立的关系。
实现深度克隆的原理得从对象是一种引用类型说起
众所周知,对象是一种引用类型,对象的地址指针存放于栈中,而对象实际的数据存放于堆中。
因此当我们简单地执行复制操作时,实际是把地址指针进行了复制操作,因此在对象的实际数据改变之后,新老对象都会受到影响。
那么如何让他不受到影响呢?
答案是利用基本数据类型的特点,基本类型在执行复制操作后,新老数值之间不会互相产生影响
所以,我们要对对象不断进行分解,直到其是基本数据类型之后,再进行复制操作。
2.实现方法
2.1 硬刚法(迭代法,适用于所有)
// 方法一 利用迭代
// 思路是:判定要克隆的对象是不是引用类型,如果是引用类型,则继续迭代,如果该项是基本类型,则直接复制。
function deepClone(obj){
let newObj=Array.isArray(obj)?[]:{}
if(obj&&typeof obj ==="object"){
for(let key in obj){
if(obj.hasOwnProperty(key)){
newObj[key]=(obj && typeof obj[key]==='object')?deepClone(obj[key]):obj[key];
}
}
}
return newObj
}
let a=[{c:1},2,3,4],
b=deepClone(a);
a[0]={c:2};
console.log(a,b);
2.2 投机取巧法(Json方法,适用于部分)
//方法2 利用JSON对象的方法
//主要是利用JSON.stringify和JSON.parse,这种办法只能实现纯数据的克隆,如果存在function则会直接忽略,不会进行复制操作
function deepClone2(obj){
return JSON.parse(JSON.stringify(obj))
}
let a1={a: 1, b: function() {}}
b1=deepClone2(a1);
console.log(a1,b1);
js实现数组、对象深度克隆的两种办法的更多相关文章
- js对数组对象的操作以及方法的使用
js对数组对象的操作以及方法的使用 如何声明创建一个数组对象: var arr = new Array(); 或者 var arr = []; 如何移除所有数组中数据? arrayJson.dataL ...
- JS去除数组中重复值的四种方法
JS去除数组中重复值的四种方法 1 /// <summary> o[this[i]] = ""; } } newArr.p ...
- php获取数组中重复数据的两种方法
分享下php获取数组中重复数据的两种方法. 1,利用php提供的函数,array_unique和array_diff_assoc来实现 <?php function FetchRepeatMem ...
- JavaScript对象属性访问的两种方式
JavaScript对象属性访问的两种方式 object.attribute object["attribute"] 例如: var employees = [ { "f ...
- js 图片base64转file文件的两种方式
js 图片base64转file文件的两种方式 https://blog.csdn.net/yin13037173186/article/details/83302628 //将base64转换为bl ...
- [转]MFC子线程中更新控件内容的两种办法
一.概述 每个系统中都有线程(至少都有一个主线程),而线程最重要的作用就是并行处理,提高软件的并发率.针对界面来说,还能提高界面的响应能力.一般的,为了应用的稳定性,在数据处理等耗时操作会单独在一个线 ...
- C# HttpClient设置cookies的两种办法
前言:最近公司使用HttpClient对象在发送请求,抛弃了之前的HttpWebRequest,使用httpClient有个好处:就是可以只使用一个HttpClient的实例,去完成发送所有的请求数据 ...
- C# HttpClient设置cookies的两种办法 (转发)
一般有两种办法 第一种handler.UseCookies=true(默认为true),默认的会自己带上cookies,例如 var handler = new HttpClientHandler() ...
- eclipse new server Cannot create a server using the selected type 网上有两种办法,其实原理一样
eclipse new server Cannot create a server using the selected type 网上有两种办法,其实原理一样 第一种说法: 还真的找到解决的方法了, ...
随机推荐
- Windows系统下Log4Net+FileBeat+ELK日志分析系统问题总结
问题如下:1.FileBeat日志报 "dial tcp 127.0.0.1:5544: connectex: No connection could be made because the ...
- Linux命令01
Linux简介及Ubuntu安装 Linux,免费开源,多用户多任务系统.基于Linux有多个版本的衍生.RedHat.Ubuntu.Debian 安装VMware或VirtualBox虚拟机.具体安 ...
- 遇到问题----linux-----linux 打开文件数 too many open files 解决方法
在运行某些命令或者 tomcat等服务器持续运行 一段时间后可能遇到 too many open files. 出现这句提示的原因是程序打开的文件/socket连接数量超过系统设定值. 查看每个用 ...
- oracle的loop
oracle的loop等循环语句的几个用法小例子 --loop循环用法 (输出1到10) ) :; begin loop v_num :; ; --上面退出循环也可以用下面3行 /* if(v_num ...
- Dubbo、Zookeeper集群搭建及Rose使用心得(一)
接触这个两三月了,是时候总结一下使用的方法以及心得体会了.我是一个菜鸟,下面写的如有错误,还请各位前辈指出.废话不多说,正式开始. 一.简介 Dubbo是Alibaba开源的分布式服务框架,它最大的特 ...
- Qt 文档编辑设置
该文章原创于Qter开源社区(www.qter.org),作者yafeilinux,转载请注明出处! 导语 前面已经在主窗口中添加了菜单和工具栏,这一篇中我们将实现基本的文本编辑功能 ...
- HAOI2018游记
前言 很懒. 太懒了. 不仅懒得写题..连游记都懒得写.. 花点时间填一下坑吧..不过话说我去年的NOI/APIO/CTSC游记也没写.. 省选前 板子好像一早就打完了,没什么可干的. 也不愿意开新题 ...
- P2657 [SCOI2009]windy数
P2657 [SCOI2009]windy数 题目描述 windy定义了一种windy数.不含前导零且相邻两个数字之差至少为2的正整数被称为windy数. windy想知道, 在A和B之间,包括A和B ...
- Hadoop生态圈-Hive快速入门篇之HQL的基础语法
Hadoop生态圈-Hive快速入门篇之HQL的基础语法 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 本篇博客的重点是介绍Hive中常见的数据类型,DDL数据定义,DML数据操作 ...
- 转:Launch Screen在iOS7/8中的实现
目前项目中需要解决的问题是: 兼容iOS7和iOS8,之前的版本不需要支持了 实现兼容3.5.4.4.7和5.5寸屏幕,竖屏的Lauch Screen 创建所需的PNG图片 有关iPhone6/6+相 ...