工作积累(四)——JavaScript深度克隆的实现
来源:互联网 发布:mac口红外盒辨别真假 编辑:程序博客网 时间:2024/06/03 20:32
JavaScript 中的数据有两种大类,即基本类型和引用类型。因为引用类型使用指针,所以在简单赋值时不能实现克隆,下面介绍两种方法来实现 JavaScript 深度克隆。
1. 原生JavaScript:
function clone(former) {if(!(former instanceof Object) || former === null || (former instanceof RegExp) || (former instanceof Function)) { return former;} if(former instanceof Array) { return former.slice(); //或 return former.concat(); } var latter = {}; for(var attr in former) { latter[attr] = clone(former[attr]); } return latter;}
其中,former 为传入的参数, latter 为克隆后返回的参数,假如我们现在有如下 obj1 对象:
var obj1 = { "name":"Lucy", "boyfriend": null, "measurements": [100,80,90], "sayHi": function() { console.log("HI~") }};
现在将 obj1 深度克隆为 obj2 ,检测一下两个对象是否相同:
var obj2 = clone(obj1);obj1 === obj2 // false
如果我们简单的赋值,再检测一下两个对象是否相同:
var obj3 = obj1;obj1 === obj3 // true
2. jQuery API:
jQuery 中已经为我们封装了方法,可以实现深度克隆,该方法为
jQuery.extend([deep],target, object1, [objectN]);
当然该方法根据接收到的参数有很多不同的用处,这里我们不深究,单纯来看一下如何用它实现深度克隆。还是之前的 obj1 对象,像将其克隆到 obj4 :
var obj4 = {};jQuery.extend(true, obj4, obj1);obj1 === obj4 // false
3. AngularJS:
AngularJS 中也封装了深度克隆方法,该方法为
angular.copy(source, [destination]);
使用起来同 jQuery 一样方便,下面将 obj1 对象克隆到 obj5 对象:
var obj5 = {};//方法一obj5 = angular.copy(obj1);//方法二angular.copy(obj1, obj5);
完。
补充:
jQuery API可参考如下链接:
http://www.php100.com/manual/jquery/
AngularJS API可参考如下链接:
http://docs.angularjs.cn/api
本文出自 “细桶假狗屎” 博客,请务必保留此出处http://xitongjiagoushi.blog.51cto.com/9975742/1658932
- 工作积累(四)——JavaScript深度克隆的实现
- 使用JavaScript实现对象的深度克隆
- javascript实现深度赋值\深度克隆
- JavaScript的对象深度克隆
- 工作积累(四)——Activity启动方式
- javascript中对象的深度克隆
- JavaScript中对象的深度克隆
- javascript中对象的深度克隆
- javascript中对象的深度克隆
- JavaScript的对象深度克隆方法
- javaScript中对象的深度克隆
- javascript中对象的深度克隆
- javascript中对象的深度克隆
- javascript中的深度克隆
- javascript深度克隆
- JavaScript 深度克隆
- JavaScript深度克隆
- Javascript 深度克隆
- Java Web开发【3】对【1】【2】中代码的修改
- 多学一点(十四)——服务器间通过rsync和inotify-tools动态同步数据
- 工作积累(三)——使用jQuery实现回车触发事件
- Maven实战(六)--- dependencies与dependencyManagement的区别
- 初窥Python(一)——使用pymongo连接MongoDB
- 工作积累(四)——JavaScript深度克隆的实现
- 暑假- 动态规划 I-(N - Coins)
- 工作积累(五)——使用spring@Value注解实现常量功能
- AngularJS(一)——从零开始AngularJS
- HTML滚动文字代码 marquee标签
- AngularJS(二)——使用AngularJS自定义service
- .gitignore文件使用说明
- 工作积累(六)——jQuery实现DOM元素事件动态绑定
- 工作积累(七)——Tomcat URIEncoding引起的中文乱码问题