JavaScript学习笔记——浅拷贝、深拷贝
参考自:http://www.cnblogs.com/yichengbo/archive/2014/07/10/3835882.html
一、数组的深浅拷贝
在使用JavaScript对数组进行操作的时候,我们经常需要将数组进行备份,事实证明如果只是简单的将它赋予其他变量,那么我们只要更改其中的任何一个,然后其他的也会跟着改变,这就导致了问题的发生。
var arr01 = ["One","Two","Three"];
var arrt02 = arr01;
arrt02[1] = "test";
console.log("arr01:" + arr01); //One,test,Three
console.log("arr02:" + arrt02); //One,test,Three
像上面的这种直接赋值的方式就是浅拷贝,很多时候,这样并不是我们想要得到的结果,其实我们想要的是arr的值不变。
方法一:js的slice方法
var arr01 = ["One","Two","Three"];
var arrt02 = arr01.slice(0);
arrt02[1] = "test";
console.log("arr01:" + arr01); //One,Two,Three
console.log("arr02:" + arrt02); //One,test,Three
方法二:js的concat方法
var arr01 = ["One","Two","Three"];
var arrt02 = arr01.concat();
arrt02[1] = "test";
console.log("arr01:" + arr01); //One,Two,Three
console.log("arr02:" + arrt02); //One,test,Three
二、对象的深拷贝
var a={name:'yy',age:26};
var b={};
b = deepCopy(a);
b.name = 'zz';
console.log(b); //Object { name="zz", age=26}
console.log(a); //Object { name="yy", age=26}
//定义对象的深拷贝方法
function deepCopy(obj) {
var result={};
for (var k in obj) {
result[k] = obj[k] instanceof Object ? deepCopy(obj[k]) : obj[k];
}
return result;
}
三、兼容数组和对象深拷贝的综合方法
var snail01 = {
name:'奔跑的蜗牛',
age:'26',
like:{
fruit:'orange',
sport:'football'
}
}
// 创建深拷贝方法
function deepCopy(obj){
var result,b; //result:存储拷贝数据,b:存储是否为数组的布尔值
b = obj instanceof Array;
if(obj instanceof Array || obj instanceof Object){
result = b ? [] : {};
for(var k in obj){
if(obj[k] instanceof Array || obj[k] instanceof Object){
result[k] = deepCopy(obj[k]);
}else{
result[k] = obj[k];
}
}
}
return result;
}
var snail02 = deepCopy(snail01);
snail02.name = 'running snail02';
snail02.like.fruit = 'banana';
console.log(snail02); // Object { name="running snail02", age="26", like=Object { fruit="banana", sport="football"}}
console.log(snail01); // Object { name="奔跑的蜗牛", age="26", like=Object { fruit="orange", sport="football"}}
JavaScript学习笔记——浅拷贝、深拷贝的更多相关文章
- Java程序猿的JavaScript学习笔记(汇总文件夹)
最终完结了,历时半个月. 内容包含: JavaScript面向对象特性分析,JavaScript高手必经之路. jQuery源代码级解析. jQuery EasyUI源代码级解析. Java程序猿的J ...
- Java程序猿的JavaScript学习笔记(8——jQuery选择器)
计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...
- Java程序猿JavaScript学习笔记(2——复制和继承财产)
计划和完成在这个例子中,音符的以下序列: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaSc ...
- Java程序猿的JavaScript学习笔记(3——this/call/apply)
计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...
- Java程序猿JavaScript学习笔记(4——关闭/getter/setter)
计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...
- Java程序猿JavaScript学习笔记(14——扩大jQuery UI)
计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...
- javascript学习笔记(四) Number 数字类型
数字格式化方法toFixed().toExponential().toPrecision(),三个方法都四舍五入 toFixed() 方法指定小数位个数 toExponential() 方法 用科学 ...
- JavaScript学习笔记之数组(二)
JavaScript学习笔记之数组(二) 1.['1','2','3'].map(parseInt) 输出什么,为什么? ['1','2','3'].map(parseInt)//[1,NaN,NaN ...
- JavaScript学习笔记[0]
JavaScript学习笔记[0] 使用的是廖雪峰JavaScript教程. 数据类型 Number 表示数字,不区分浮点整形. === 比较时不转化数据类型. == 反之. NaN与任何值都不想等, ...
随机推荐
- LINUX目录的意思
Linux系统/目录下的文件夹里面分别是以下内容: /usr 包含所有的命令和程序库.文档和其他文件,还包括当前linux发行版的主要应用程序 /var 包含正在操作的文件,还有记录文件.加密文件.临 ...
- 管理员常用Windows PowerShell命令Top25
即使Windows PowerShell已经由来已久,但很多管理员并不愿意主动熟悉PowerShell cmdlet命令行.随着微软扩展了PowerShell的功能,管理员应该对其功能及使用烂熟于心. ...
- PostgreSQL字段名和表名大小写的问题
创建表的时候,表名和字段名必须全小写,然后查询的时候不管全大写或全小写,或是Camel模式都不会报错.只要名称中有大写字母,或者全大写,查询时就必须保证大小写正确并用双引号包起来,否则就会报“XXX不 ...
- javac一次性编译多个包下的.java文件
如题是我想要知道的,然后在网上搜了一下 下面是在某些帖子里看到别人说的只言片语 =========================================================== ...
- Linux下创建pycharm的快捷方式
第一步:创建桌面快捷方式文件Pycharm.desktop,并打开 sudo gedit /usr/share/applications/Pycharm.desktop 第二步:在打开的文件Pycha ...
- 字面值常量&&转义序列
字面值常量举例: 字面值常量的分类 示例 备注 整型 42.024(八进制数).0x23(十六进制) short类型没有对应的字面值 浮点型 3.14.3.14E2(指数) 默认类型是double 字 ...
- Week1 Team Homework #1 from Z.XML-项目选择思路--基于对曾经大作业项目的思考
这两天试玩了一下去年学长的满分工程<shield star>游戏,再结合了一下他们团队的博客记录,有一种非常牛逼的感觉.具体对于这款游戏的一些思考和看法,毛大神已经说的很好了.因此,这里主 ...
- 编程练习:寻找发帖"水王"扩展问题一
回顾 寻找发帖水王的问题总结起来就是在一个数组中某一个元素出现次数超过了数组长度的一半,那么可以很顺利的找到这个元素,实现见"编程练习:寻找发帖水王" 扩展 上面的问题中,强调了某 ...
- iterator 的设计原则和traits
iterator我前面写过是作为algorithm和container之间的一个桥梁,algorithm进程操作的时候向iterator进行提问,iterator并对提问进行了回答,其中主要就是回答5 ...
- 基于SDN的IP RAN网络虚拟化技术
http://www.zte.com.cn/cndata/magazine/zte_technologies/2014/2014_4/magazine/201404/t20140421_422858. ...