js对象简单、深度克隆(复制)
javascript的一切实例都是对象,只是对象之间稍有不同,分为原始类型和合成类型。原始类型对象指的是字符串(String)、数值(Number)、布尔值(Boolean),合成类型对象指的是数组(Array)、对象(Object)、函数(Function)。
既然对象分为这两类,他们之间的最大差别是复制克隆的差别。普通对象存储的是对象的实际数据,而引用对象存储的是对象的引用地址,而把对象的实际内容单独存放,因为引用对象通常比较庞大,这是数据开销和内存开销优化的手段。通常初学者很难理解这部分内容,就像对象的原型一样,也是同一个概念。对象的原型也是引用对象,把原型的方法和属性放在单独内存当中,而对象的原型链则指向这个内存地址。尽管这部分内容比较拗口复杂,那其中的原理都是一致的,目的也一致。
1、原始类型对象的克隆
1.1、字符串的克隆
- var x="1";
- var y=x;
- y="2";
- // "1"
- alert(x);
- // "2"
- alert(y);
1.2、数值的克隆
- var x=1;
- var y=x;
- y=2;
- // 1
- alert(x);
- // 2
- alert(y);
1.3、布尔值的克隆
- var x=true;
- var y=x;
- y=false;
- // true
- alert(x);
- // false
- alert(y);
2、合成类型对象的克隆
2.1、数组的克隆
如果采用普通克隆:
- var x=[1,2];
- var y=x;
- y.push(3);
- // 1,2,3
- alert(x);
- // 1,2,3
- alert(y);
由上可知,原始数组x,克隆数组y,修改了克隆数组y,但也同时修改了原始数组x,这就是引用对象的特点。那么如何才能达到完整的数组克隆呢?
- var x=[1,2];
- var y=[];
- var i=0;
- var j=x.length;
- for(;i<j;i++)
- {
- y[i]=x[i];
- }
- y.push(3);
- // 1,2
- alert(x);
- // 1,2,3
- alert(y);
这样,克隆数组y,原始数组x,两个数组互补干扰,实现了完整的数组克隆。
2.2、对象的克隆
和数组的克隆同理,对象的完整克隆如下:
- var x={1:2,3:4};
- var y={};
- var i;
- for(i in x)
- {
- y[i]=x[i];
- }
- y[5]=6;
- // Object {1: 2, 3: 4}
- console.log(x);
- // Object {1: 2, 3: 4, 5: 6}
- console.log(y);
2.3、函数的克隆
var x=function(){alert(1);};
var y=x;
y=function(){alert(2);}; // function(){alert(1);};
alert(x); // y=function(){alert(2);};
alert(y);
函数的克隆,使用“=”符号就可以了,并且在改变克隆后的对象,不会影响克隆之前的对象,因为克隆之后的对象会单独复制一次并存储实际数据的,是真实的克隆。
3、完整的对象克隆
根据1和2,总结一下完整的对象克隆,包括克隆普通对象、引用对象。在写这个方法之前,我们必须想到的是,克隆引用对象必须采用完整克隆(深度克隆),包括对象的值也是一个对象也要进行完整克隆(深度克隆)。
完整的对象克隆又称为深度对象克隆、对象的深度克隆、对象的深度复制等等。
- function clone(obj)
- {
- var o,i,j,k;
- if(typeof(obj)!="object" || obj===null)return obj;
- if(obj instanceof(Array))
- {
- o=[];
- i=0;j=obj.length;
- for(;i<j;i++)
- {
- if(typeof(obj[i])=="object" && obj[i]!=null)
- {
- o[i]=arguments.callee(obj[i]);
- }
- else
- {
- o[i]=obj[i];
- }
- }
- }
- else
- {
- o={};
- for(i in obj)
- {
- if(typeof(obj[i])=="object" && obj[i]!=null)
- {
- o[i]=arguments.callee(obj[i]);
- }
- else
- {
- o[i]=obj[i];
- }
- }
- }
- return o;
- }
4、参考资料
js对象简单、深度克隆(复制)的更多相关文章
- js对象的深度克隆
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 【JavaScript代码实现三】JS对象的深度克隆
function clone(Obj) { var buf; if (Obj instanceof Array) { buf = []; // 创建一个空的数组 var i = Obj.length; ...
- MyDAL - 引用类型对象 .DeepClone() 深度克隆[深度复制] 工具 使用
索引: 目录索引 一.API 列表 .DeepClone() 用于 Model / Entity / ... ... 等引用类型对象的深度克隆 特性说明 1.不需要对对象做任何特殊处理,直接 .Dee ...
- javascript中对象的深度克隆
记录一个常见的面试题,javascript中对象的深度克隆,转载自:http://www.2cto.com/kf/201409/332955.html 今天就聊一下一个常见的笔试.面试题,js中对象的 ...
- JAVA对象的深度克隆
有时候,我们需要把对象A的所有值复制给对象B(B = A),但是这样用等号给赋值你会发现,当B中的某个对象值改变时,同时也会修改到A中相应对象的值! 也许你会说,用clone()不就行了?!你的想法只 ...
- JavaScript实现对象的深度克隆及typeof和instanceof【简洁】【分享】
JavaScript实现对象的深度克隆 代码实现如下: <!DOCTYPE html> <html lang="en"> <head> < ...
- js对象/数组深度复制
今天碰到个问题,js对象.数组深度复制:之前有见过类似的,不过没有实现函数复制,今晚想了一下,实现代码如下: function clone(obj) { var a; if(obj instanceo ...
- JavaScript对象之深度克隆
也不知道从什么时候开始,前端圈冒出了个新词:对象深度克隆.看起来好像很高大上的样子,实际上并不新鲜,在我们的实际项目开发中,你可能早已用到,只不过由于汉字的博大精深,有些原本很简单的事物被一些看似专业 ...
- javascript对象的深度克隆
在做项目的时候需要向对象里面添加新属性,又不想修改原对象.于是就写: var newObj = oldObj,但是新对象属性改变后就对象也会跟着改变,这是因为无论是新对象还是旧对象,指向的内存地址都是 ...
随机推荐
- 《ActiveMQ in Action》例子
本章内容: 介绍本书中所有例子的使用场景 使用 Maven 编译.运行例子 例子中怎么使用 ActiveMQ 简介 ActiveMQ 不仅实现了 JMS 规范中定义的所有特性,也额外提供了一些特有且有 ...
- 井眼轨迹的三次样条插值 (vs + QT + coin3d)
井眼轨迹数据的测量值是离散的,根据某些测斜公式,我们可以计算出离散的三维的井眼轨迹坐标,但是真实的井眼轨迹是一条平滑的曲线,这就需要我们对测斜数据进行插值,使井眼轨迹变得平滑,我暂时决定使用三次样条进 ...
- java:jsp: ResourceBundle国际化多语言
java提供了一个资源类java.util.ResourceBundle来试下多国语言版本.其实ResourceBundle只是一个抽象的类,她有两个子类:ListResourceBundle,和,P ...
- docker安装 之 ---CentOS 7 系统脚本自动安装
[使用脚本自动安装] 在测试或开发环境中Docker官方为了简化安装流程,提供了一套便捷的安装脚本,CentOS系统上可以使用这套脚本安装: $ curl -fsSL get.docker.com - ...
- 将一个jar包放到linux下定时执行
将一个jar包放到linux下定时执行 1.在dbtodb文件夹下新建一个dbtodb.sh,脚本内容为: #!/bin/bash cd /usr/dbtodb/ java -jar dbtodb.j ...
- StratifiedShuffleSplit 交叉验证
python中数据集划分函数StratifiedShuffleSplit的使用 文章开始先讲下交叉验证,这个概念同样适用于这个划分函数 1.交叉验证(Cross-validation) 交叉验证是指在 ...
- java调接口
package util; import java.io.BufferedReader; import java.io.DataOutputStream; import java.io.InputSt ...
- Linux tar命令总结
压缩 tar –cvf jpg.tar *.jpg 将目录里所有jpg文件打包成tar.jpg tar –czf jpg.tar.gz *.jpg 将目录里所有jpg文件打包成jpg.tar后, ...
- mac环境下利用MAMP配置PHPStorm
刚刚准备搞php稍微研究一下,结果第一步就卡到了.各种配置问题,教程找了又找,找了又找,总算是成功了.纪念一下.配置截图.同时解决phpstorm 不能接受post 表单数据的问题. 推荐大家支持正版 ...
- SVN管理多个项目版本库 (windows,linux 通用)
SVN管理多个项目版本库: . 安装SVN服务器软件,路径: C:\Program Files\Subversion . 在D盘创建svn根目录D:\SVN-CM . 在D:\SVN-CM下创建SVN ...