【深拷贝/浅拷贝】javascript的深拷贝和浅拷贝 分类: js javascript深拷贝 深拷贝浅拷贝 javascript 2015-08-10 11:29 7人阅读 评论(0) 收藏
2015-08-10 11:29
811 查看
javascript 中 对于对象和数组而言,用 = 做的简单赋值就是浅拷贝,因为对象和数组在引用赋值的时候传递的只是指针。
1、浅拷贝
这个例子中就是一个浅拷贝,对于数组b和对象c而言,
拷贝的数组b2和对象c2,只是传递了指针,
所以 b2[2]=‘22’; 这一句改变了原始数组 b[2] 中的内容,
c2.A = 'haha'; 这一句改变了原始对象 c.A 中的内容,
如果希望的是仅针对拷贝出来的数组b2和对象c2中的内容有所更改,那么就需要用到深拷贝。
2、深拷贝
深拷贝demo下载地址:
http://download.csdn.net/detail/snow_finland/8984215
参考资料:
1、如何判断js中的数据类型
http://blog.sina.com.cn/s/blog_51048da70101grz6.html
2、javascript中的浅拷贝和深拷贝
http://blog.csdn.net/yisuowushinian/article/details/45544343
1、浅拷贝
var a = 1; var b = ['1','2',[1,2,3]]; var c = { A : 1, B : function(tmp1,tmp2){ return tmp1 - tmp2; }, C : [1,2,['1','2']] } var a2 = a; a2 = 3; var b2 = b; b2[2] = '22'; var c2 = c; c2.A = 'haha'; console.log(a); console.log(a2); console.log(b); console.log(b2); console.log(c); console.log(c2);
这个例子中就是一个浅拷贝,对于数组b和对象c而言,
拷贝的数组b2和对象c2,只是传递了指针,
所以 b2[2]=‘22’; 这一句改变了原始数组 b[2] 中的内容,
c2.A = 'haha'; 这一句改变了原始对象 c.A 中的内容,
如果希望的是仅针对拷贝出来的数组b2和对象c2中的内容有所更改,那么就需要用到深拷贝。
2、深拷贝
/* * 判断数据类型 v 1.0.0 * Copyright 2015-08-10 Jane * * is_obj(source) 判断是否为对象(包括数组),source传递的是需要判断的变量 * is_arr(source) 判断是否为数组,source传递的是需要判断的变量 */ var obj_type = { is_obj : function(source){ if(typeof source == 'object'){ return true; }else{ return false; } }, is_arr : function(source){ var self = this; if(self.is_obj(source)){ if(source instanceof Array){ return true; }else{ return false; } }else{ return false; } } } /* * javascript深拷贝 v 1.0.0 * Copyright 2015-08-10 Jane * source 为需要深拷贝的变量 */ var deep_copy = function(source){ var result; // 如果需要深拷贝的是对象(或数组) if(obj_type.is_obj(source)){ // 如果需要深拷贝的是数组 if(obj_type.is_arr(source)){ result = []; // 遍历该数组,对于数组中每一个值做递归的深拷贝 for(var i = 0; i < source.length; i++){ result[i] = deep_copy(source[i]); } // 如果需要深拷贝的是对象(但不是数组) }else{ result = {}; // 遍历该对象,对于对象中每一个值做递归的深拷贝 for(var i in source){ // 对于对象而言,过滤掉原型链上的属性(仅拷贝自定义的属性) if(source.hasOwnProperty(i)) { result[i] = deep_copy(source[i]); } } } // 如果需要深拷贝的不是对象(和数组),那么直接用等号赋值 }else{ result = source; } return result; } var a = 1; var b = ['1','2',[1,2,3]]; var c = { A : 1, B : function(tmp1,tmp2){ return tmp1 - tmp2; }, C : [1,2,['1','2']] } var a2 = deep_copy(a); var b2 = deep_copy(b); var c2 = deep_copy(c); a2 = 3; b2[1] = '22'; b2[2][2] = '22'; c2.A = 'haha'; console.log(a); console.log(a2); console.log(b); console.log(b2); console.log(c); console.log(c2);
深拷贝demo下载地址:
http://download.csdn.net/detail/snow_finland/8984215
参考资料:
1、如何判断js中的数据类型
http://blog.sina.com.cn/s/blog_51048da70101grz6.html
2、javascript中的浅拷贝和深拷贝
http://blog.csdn.net/yisuowushinian/article/details/45544343
相关文章推荐
- 一个简单的jsp+servlet实例,实现简单的登录
- JavaScript中的方法重载
- json跨域请求报错
- json小结
- Json还可以这样用
- js监听浏览器,关闭,刷新(兼容IE6+,Firefox,Chrome,Safari)
- 后台调用js,给同一个事件绑定一个方法
- Js://计算天数
- js绑定事件方法:addEventListener与attachEvent的不同浏览器的兼容性写法
- js如何执行函数
- javascript中caller和callee详解
- javascript 延长作用域链 与没有块级作用域
- HTML和JavaScript函数之间的关系
- jsp页面通过uploadfile工具上传文件
- javascript中$(function() {});写与不写有哪些区别
- 通过firefox插件firebug获取webqq群和群成员的javascript脚本
- Javascript模块化编程(三):require.js的用法
- JS函数式编程【译】3.1 Javascript的函数式库
- JS 节流阀
- 使用JDeveloper 11g 发布Web应用(基于ADF、EJB、JPA、JSF)