JavaScript深度克隆（深度拷贝）一个对象 -- JavaScript -- IT技术博客大学习 -- 共学习共进步！

您现在的位置：首页 --> JavaScript --> JavaScript深度克隆（深度拷贝）一个对象

JavaScript深度克隆（深度拷贝）一个对象

浏览:5195次出处信息

我有一个前端笔试题：使用JavaScript深度克隆一个对象。可是我发现大多数人都是空白，问他为什么不做，大部分说不懂这题目的意思。

科普一下：

js一般有两种不同数据类型的值：

基本类型（包括undefined,Null,boolean,String,Number），按值传递；

引用类型（包括数组，对象），按址传递，引用类型在值传递的时候是内存中的地址。例如：

1var a={"a":1};
2
3var b=a;
4
5b["b"]=2;
6
7console.log(a);//{"a":1,"b":2};

如果你修改b的值，那么a变量的值也发生了变化。

克隆或者拷贝分为2种：浅度克隆（拷贝），深度克隆（拷贝）；

浅度克隆：基本类型为值传递，对象仍为引用传递。

深度克隆：所有元素或属性均完全克隆，并于原引用类型完全独立，即，在后面修改对象的属性的时候，原对象不会被修改。

我的深度克隆代码如下：

01function cloneObject(o) {
       if(!o || 'object' !== typeof o) {
           return o;
       }
       var temp;
       if(o.constructor === Array){
           //temp=o.concat();
           temp = [];
           var i = o.length;
           while (i--) {
               temp[i] = cloneObject(o[i]);
           }
       }else if(o.constructor === Object){
           temp = {}; 
           for (var k in o) {
               if(o.hasOwnProperty(k)){
                   temp[k] = cloneObject(o[k]);
               }
           }
       }
       return temp;
   }

主要使用了递归。
不过代码看上去挺变扭的，被朋友批了一顿，数组本来就是对象，可以精简代码。优化了一下，欢迎拍砖：

1function cloneObject(obj){
2    var o = obj.constructor === Array ? [] : {};
3    for(var i in obj){
4        if(obj.hasOwnProperty(i)){
5            o[i] = typeof obj[i] === "object" ? cloneObject(obj[i]) : obj[i];

						QQ技术交流群：445447336，欢迎加入！

						扫一扫订阅我的微信号：IT技术博客大学习

<< 前一篇：jQuery选择器探讨进阶

后一篇：Javascript的那些事儿 >>

文章信息

作者：愚人码头来源： WEB前端开发
标签：克隆深度克隆
发布时间：2013-03-11 13:55:16

近3天十大热文