返回

关于复制对象

复制对象有深复制和浅复制,有什么区别?

  • 浅复制:把数据的地址赋值给对应变量,而没有把具体的数据复制给变量,只随这个地址上的数据变化而变化。
  • 深复制:把数据赋值给对应的变量,并给这个变量开辟一个新的地址

理解浅复制

var a = 1; var b = {s1:2,s2:3}; var c=[0,1,2,3]; var d = {s1:2,s2:3}
var a1 = a; var b1= b; var c1=c; var d1=d;
console.log(a1,b1,c1,d1); //1 s1:2,s2:3 [0,1,2,3] //s1:2,s2:3
a=11; b1.s1=22; c[3]=33; d={x1:2,x2:3};
console.log(a1,b1,c1,d1); //1 s1:22,s2:3 [0,1,2,33] //s1:2,s2:3

对象赋值其实都是引用传值,传递的是一个地址。对于a和d我们给它传递了一个新地址,但是a1和d1还是指向的原来那个地址,原来地址中的值没变,所以a1和d1也就不会变。浅复制不会随着存储数据地址的变化而变化,只会随着数据值的变化而变化。 还是弄不清除?举个例子吧:在考场里有个表,所有人看时间都要去找这个表,这个表时间变了(数据值变了)所有人得到的时间也都随之而变。

理解深复制

还是上边的例子,如果把时间深复制给你就相当于给你戴个手表,你手表的时间就与考场的表无关了,你可以随便调你手表(开辟了一个新地址存储时间)的时间而不会影响其他人得到的时间。 深复制时间需要戴个手表,那么深复制数据我们也需要借助一些工具,比如jQuery。

jQuery的$.extend()方法实现深复制

var x = {
    a: 1,
    b: { f: { g: 1 } },
    c: [ 1, 2, 3 ]
};
var y = $.extend({}, x),          //浅复制
    z = $.extend(true, {}, x);    //深复制

y.b.f === x.b.f       // true
z.b.f === x.b.f       // false

$.extend作用是合并两个或多个对象,它可以接受第一个参数true,合并成为递归(深拷贝)