您的位置：首页 > Web前端 > JavaScript

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

2012-11-19 09:02 501 查看
科普一下：

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

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

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

1
var
a={
"a"
:1};
2
3
var
b=a;
4
5
b[
"b"
]=2;
6
7
console.log(a);
//{"a":1,"b":2};
如果你修改b的值，那么a变量的值也发生了变化。

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

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

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

我的深度克隆代码如下：

01
function
cloneObject(o) {
02
if
(!o ||
'object'
 
!==
typeof

o) {
03
return

o;
04
}
05
var

temp;
06
if
(o.constructor === Array){
07
//temp=o.concat();
08
temp = [];
09
var

i= o.length;
10
while

(i--) {
11
temp[i] = cloneObject(o[i]);
12
}
13
}
else

if
(o.constructor === Object){
14
temp = {};
15
for

(
var
 
k
in
 
o) {
16
if
(o.hasOwnProperty(k)){
17
temp[k] = cloneObject(o[k]);
18
}
19
}
20
}
21
return

temp;
22
}
主要使用了递归。

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

1
function
 
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];
6
}
7
}
8
return

o;
9
}
另：如果是一个简单的数组，元素中没有引用类型的值，可以直接用array.concat();或者array.slice(0);来深度拷贝一个数组，这样简单又高效。数组的concat()和slice()本来就会生成一个新的数组，原来的数组不会受影响。但是要注意的是你要确保被拷贝的数组中元素中没有引用类型的值。
                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航