js的深层克隆和浅层克隆代码和理解
<script>
//判断是不是原始值
//判断是数组还是对象
//建立相应的数组或对象
var obj={
name:'辣鸡',
sex:'male',
card:['laobi','feiwu'],
wife:{
name:'智障',
son:{
name:'彩笔'
}
}
}
var obj1={}
function deepClone(Origin,Target){
var Target=Target ||{},
toStr = Object.prototype.toString,
arrStr = '[object Array]';
for(var prop in Origin){
//第一步,判断对象是不是原始值
if(Origin.hasOwnProperty(prop)){
if(typeof(Origin[prop])=='object'){
if(toStr.call(Origin[prop]) == arrStr){
Target[prop]=[];
}else{
Target[prop] = {};
}
deepClone(Origin[prop],Target[prop]);
}
else{
Target[prop] = Origin[prop];
}
}
}
}
</script>
深层克隆
注意:判断是否是原型的方法,要首先想到for in 和hasProperty的方法,然后再用typeof(Origin[prop]) =='object',
判断数组和对象的方法,则有三种,constructor ,toString call ,instanceof
此处用的是toString.call(Origin[prop]=='arrStr'),其实就是判断是否是[object Array]
最后递归则用回调deepClone()方法,建立相应数组和对象
下面是通过三目运算符完善代码,并且加了判断方法不为空,还有加了返回值Target
function deepClone(Origin,Target){
var Target=Target ||{},
toStr = Object.prototype.toString,
arrStr = '[object Array]';
for(var prop in Origin){
//第一步,判断对象是不是原始值
if(Origin.hasOwnProperty(prop)){
if(typeof(Origin[prop])=='object' && Origin[prop] !=='null'){
target[prop] = toStr.call(Origin[prop]) == arrStr ?[]: {};
deepClone(Origin[prop],Target[prop]);
}
else{
Target[prop] = Origin[prop];
}
}
}
return Target;
}
浅层克隆
var obj3={
name:'abc',
sex:'boy',
height:178}
var obj4={} function clone(Origin,Target){
var Target = Target||{};//防止用户不传Target
for ( prop in Origin){
Target[prop]=Origin[prop]
}
return Target;
}
clone(obj3,obj4)
需要注意的是,如果修改Origin的值,则不会改变Target的值
但是如果obj3里面有数组属性,调用方法改变obj4的数组属性时,也会改变obj3,因为是引用属性:
js的深层克隆和浅层克隆代码和理解的更多相关文章
- java中浅层克隆和深层克隆
1.浅复制与深复制概念 浅复制(浅克隆) 被复制对象的所有变量都含有与原来的对象相同的值,而所有的对其他对象的引用仍然指向原来的对象.换言之,浅复制仅仅复制所考虑的对象,而不复制它所引用的对象 ...
- c++中深层复制(浅层复制运行错误)成功运行-----sample
下面随笔给出c++中深层复制(浅层复制运行错误)成功运行------sample. 浅层复制与深层复制 浅层复制 实现对象间数据元素的一一对应复制. 深层复制 当被复制的对象数据成员是指针类型时,不是 ...
- Java中的Clone机制(浅层复制)
浅层复制代码: import java.util.*; class Int{ private int i; public Int(int ii){i = ii;} public void increm ...
- java数组对象的浅层复制与深层复制
实际上,java中数组对象的浅层复制只是复制了对象的引用(参考),而深层复制的才是对象所代表的值.
- .net中String是引用类型还是值类型 以及 C#深层拷贝浅层拷贝
http://www.cnblogs.com/yank/archive/2011/10/24/2204145.html http://www.cnblogs.com/zwq194/archive/20 ...
- MLDS笔记:浅层结构 vs 深层结构
深度学习出现之前,机器学习方面的开发者通常需要仔细地设计特征.设计算法,且他们在理论上常能够得知这样设计的实际表现如何: 深度学习出现后,开发者常先尝试实验,有时候实验结果常与直觉相矛盾,实验后再找出 ...
- 深度学习笔记之关于基本思想、浅层学习、Neural Network和训练过程(三)
不多说,直接上干货! 五.Deep Learning的基本思想 假设我们有一个系统S,它有n层(S1,…Sn),它的输入是I,输出是O,形象地表示为: I =>S1=>S2=>….. ...
- js制作带有遮罩弹出层实现登录小窗口
要实现的效果如下 点击“登录”按钮后,弹出登录小窗口,并且有遮罩层(这个名词还是百度知道的,以前只知道效果,却不知道名字) 在没有点击“登录”按钮之前登录小窗口不显示,点击“登录”按钮后小窗口显示,并 ...
- struts2.1笔记01:MVC框架思想浅层理解
1. Struts 1是全世界第一个发布的MVC框架: 它由Craig McClanahan在2001年发布,该框架一经推出,就得到了世界上Java Web开发者的拥护,经过长达6年时间的锤炼,S ...
随机推荐
- sql server 备份与恢复系列四 大容量模式下的备份与还原
一. 概述 在sql server 备份与恢复系列的第一篇里,有讲到大容量模式下备份与还原的相关知识.这篇重点来演示在大容量模式下常用的备份与还原模式“完整备份+差异备份+日志备份”. 在大容量恢复模 ...
- 在微信小程序中使用图表
前言:网上有许多的图表库,如:Echarts.Tau Charts.ChartJS等等,具体自行百度. 这次我们使用的是:Echarts 官方教程:点击查看 Echarts下载地址:飞机直达 1.下载 ...
- [NewLife.XCode]事务处理(算准你的每一分钱)
NewLife.XCode是一个有10多年历史的开源数据中间件,支持nfx/netstandard,由新生命团队(2002~2019)开发完成并维护至今,以下简称XCode. 整个系列教程会大量结合示 ...
- PEB标记反调试方法
PEB标记反调试方法 一丶PEB结构简介 PEB.简称进程环境快. 我们在讲DLL隐藏的时候已经说过了. 具体博客链接: https://www.cnblogs.com/iBinary/p/96018 ...
- 一文带你看懂cookie,面试前端不用愁
本文由云+社区发表 在前端面试中,有一个必问的问题:请你谈谈cookie和localStorage有什么区别啊? localStorage是H5中的一种浏览器本地存储方式,而实际上,cookie本身并 ...
- 一致性Hash算法(分布式算法)
一致性哈希算法是分布式系统中常用的算法,为什么要用这个算法? 比如:一个分布式存储系统,要将数据存储到具体的节点(服务器)上, 在服务器数量不发生改变的情况下,如果采用普通的hash再对服务器总数量取 ...
- Jenkins入门之导航操作
通过前面章节讲解我们已经创建了构建任务,我们已经进入了三层目录,如何回到上一级界面?如何直接回到主界面?如何知道我当前所在的位置? 我们看一下红框框选的部分,为Jenkins导航树,从这个导航树,很多 ...
- centos安装Nginx1.9.9
今天在安装centos的时候,又出现了yum报错的情况,弄了半个小时就弄好,就直接放弃了,使用了VMware快照功能.(快照功能要经常使用,我使用的频率不高,所以这次又造成了以前安装好的很多模块又得重 ...
- Python字典小结
字典(dict)结构是Python中常用的数据结构,笔者结合自己的实际使用经验,对字典方面的相关知识做个小结,希望能对读者一些启发~ 创建字典 常见的字典创建方法就是先建立一个空字典,然后逐一 ...
- H5调取APP或跳转至下载
来源: 最近在配合移动端做几个详情页h5分享页面,需要调取App并跳转至app详情页, 如果没有安装App,需要判断引导至下载页面. 参考文档: https://juejin.im/post/5b7e ...