深度拷贝数组、对象

我们在js程序中需要进行频繁的变量赋值运算，对于字符串、布尔值等可直接使用赋值运算符 “=” 即可，但是对于数组、对象，如果用“=”赋值，也许你们也和我一样碰到过修改赋值后的变量，原来的数据也会相应的改变。以下是解决方法：

1、slice()

Var arr=["a", "b"]

Var arrCopy = arr.slice(0);

arrCopy[1] = "c";

arr   // => ["a", "b"]

arrCopy   // => ["a", "c"]

在这里我们的思路是直接从数组开头截到尾，该方法并不会修改数组，而是返回一个子数组。

2、concat()

 

concat() 方法用于连接两个或多个数组。调用格式为：

arrayObject.concat(arrayX,arrayX,......,arrayX)

 

Var arr=["a", "b"]

arrCopy = arr.concat();

arrCopy[1] = "c";

arr   // => ["a", "b"]

arrCopy   // => ["a", "c"]

该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。

使用这种方法的思路是我们用原数组去拼接一个空内容，返回的便是这个数组的拷贝：

3、extend()

   1)extend({},item1,item2,……)

用这个方法，可以将所得的结果全部合并在{}中，并返回，而且还不会破坏原有的项的结构。

示例：

Var item={name:”olive”,age:23};

Var item1={name:”Momo”,sex:”gril”};

Var result=$.extend({},item,item1);

结果：

Result={name:”Momo”,age:23,sex:”gril”};

以上的结果表明extend方法将所有的项都合并到了{}中，但是，细心一点就会发现，其中item1中的name：“Momo” 将item中的name：“olive”给覆盖了，这是怎么回事？请接着往下看。

2) extend(bool,{},item1,item2….)

bool型参数为true表示深拷贝，为false时表示浅拷贝。具体可以通过一下示例来说明：

var item={name:'Amy,age:23,address:{'provice':'海南','city':'海口'}};

var item1={sex:'girl',address:{city:'深圳'}};

var result=$.extend(true,item,item1);

var result1=$.extend(false,item,item1);

　　

结果：

Result={name：“'Amy”,age:23,sex:”gril”,address:{provice:”海南”,city:”深圳”}};

Result1={name：“'Amy”,age:23,sex:”gril”,address:{ city:”深圳”}};

说明：

当参数为ture时，即为深拷贝，当子项item1中的子项有与item中的子项相同属性的值不一样时，item1中子项的值会将item子项中的值给覆盖，当子项item1的属性跟item中的属性不同时，会与item进行合并。

当参数为false时，子项item1中的子项中与item中的子项属性相同时，item1中子项的属性值会将item中的值给完全覆盖。

如果拷贝的是数组，就用extend(bool,[],item1,item2….)