js中的深拷贝与浅拷贝

//例子1

var a = 30;

var b = a;

b= 20;

console.log(a,b)//30,20

//例子2

var a = {m:20,n:30};

var b = a;

b.m = 40;

console.log(a,b)//{m:20,n:30},{m:40,n:30}

在JavaScript中，我们要取得的值，其实是通过对象指向的引用地址，在堆内存中对应的值。

在例子1中 a=30；在变量对象中的数据发生复制行为时，系统会自动为新的变量分配一个新值。var b =a执行之后，a与b虽然值都等于20，但是他们其实已经是相互独立互不影响的值了.

在例子2 中 我们通过var b = a执行一次复制引用类型的操作。引用类型的复制同样也会为新的变量自动分配一个新的值保存在变量对象中，但不同的是，这个新的值，仅仅只是引用类型的一个地址指针。当地址指针相同时，尽管他们相互独立，但是在变量对象中访问到的具体对象实际上是同一个.

例子2就属于浅拷贝，所谓浅拷贝就是复制了对象的指针地址，当有一方改变时，另一方也会发生改变。

深拷贝就是把这个对象的所有属性都拷贝出去，但是会指向不同的指针地址。两个已经是相互独立的个体，不会发生改变。

对象和数组的深拷贝方法。

1.数组

var a = [12,22];

var b = a;

b[0] = 'hello';

console.log(a,b)//['hello',22],['hello',22]

显然上面这种情况不是我们想要的，b数组的改变不能影响a;

var a = [12,22];

var b = a.conact();

b[0] = 'hello';

console.log(a,b)//[12,22],['hello',22]

var a = [12,22];

var b = a.slice(0);

b[0] = 'hello';

console.log(a,b)//[12,22],['hello',22]

var a = [12,22];

var [...b] = a;

b[0] = 'hello';

console.log(a,b)//[12,22],['hello',22]

对象的深拷贝

var a ={

    m:20,

    n:30

}

var b = a ;

b.m ='hello';

console.log(a,b)//{m:'hello',n:30},{m:'hello',n:30}

var a ={

    m:20,

    n:30

}

var b = Json.parse(Json.stringify(a)) ;

b.m ='hello';

console.log(a,b)//{m:20,n:30},{m:'hello',n:30}

var a ={

    m:20,

    n:30

}

var {...b}= a;

b.m = 'hello';

console.log(a,b)//{m:20,n:30},{m:'hello',n:30}