JS - 变量拷贝 - 代码天地

本文链接： https://blog.csdn.net/kelly0721/article/details/100182898

变量拷贝包括浅复制和深复制
浅（引用）拷贝：共用同一内存地址,你改值我也变
深拷贝：深拷贝即创建新的内存地址保存值(互不影响)

一、浅拷贝
数据类型有六种：Number、String、Undefined、Null、Boolean、Object
其中前五种在内存中是直接存储数据的，所以对象复制就相当于直接新对象开辟一个新的内存空间，然后为新的内存空间赋值，新旧两个变量是不同内存空间，同一个值。对于前五种数据类型，浅复制和深复制没有区别。
如果数据类型是Object，他在数据空间中真正存储的一个地址，数据都是存储在另外一个地方，通过存储的那个地址可以访问，所以对象的简单拷贝就只是仅仅在新开辟的数据空间中复制了那个地址，所以如果对原来对象里面的数进行改变，新的对象也会受到影响。

var a1 = '123';
var b1 = a1;
var a2 = 123;
var b2 = a2;
var a3 = false;
var b3 = a3;
var a4 = undefined;
var b4 = a4;
var a5 = null;
var b5 = a5;
var a6 = { a: '123'};
var b6 = a6;
console.log(a1, b1); // 123 123
console.log(a2, b2); // 123 123
console.log(a3, b3); // false false
console.log(a4, b4); // undefined undefined
console.log(a5, b5); // null null
console.log(a6, b6); // { a: '123' } { a: '123' }

a1 = '234';
a2 = 234;
a3 = true;
a4 = 'a';
a5 = 'a';
a6.a = '234';
console.log(a1, b1); // 234 123
console.log(a2, b2); // 234 123
console.log(a3, b3); // true false
console.log(a4, b4); // a undefined
console.log(a5, b5); // a null
console.log(a6, b6); // { a: '234' } { a: '234' }

二、深复制
之前说过，对象普通的复制就只是仅仅将对象的存储地址复制一次，深复制，就是开辟一片新的数据空间存储数据，新的对象存储的地址是新开辟空间的引用地址，与原来对象存储的地址完全不一样。Object 包括 Arrary，接下来就拿数组举例

var a7 = [1,2,3];
var b7 = a7;
var c7 = [...a7];
console.log(a7, b7, c7); // [ 1, 2, 3 ] [ 1, 2, 3 ] [ 1, 2, 3 ]
a7[0] = 0;
console.log(a7, b7, c7); // [ 0, 2, 3 ] [ 0, 2, 3 ] [ 1, 2, 3 ]

三、深复制的方法

ES6 的扩展运算符(…)
Object.assign()
JSON.parse(JSON.stringify(obj))

var a8 = [1,2,3,[4,5]];
var b8 = a8;
var c8 = [...a8];
var d8 = Object.assign([], a8);
var e8 = JSON.parse(JSON.stringify(a8));
console.log(a8,b8,c8,d8,e8); // a8-e8: [1,2,3,[4,5]]
a8[0] = 0;
a8[3][0] = 6;
console.log(a8,b8,c8,d8,e8);
/*
[ 0, 2, 3, [ 6, 5 ] ]
[ 0, 2, 3, [ 6, 5 ] ]
[ 1, 2, 3, [ 6, 5 ] ]
[ 1, 2, 3, [ 6, 5 ] ]
[ 1, 2, 3, [ 4, 5 ] ]
*/

由上可看出，扩展运算符与 Object.assign() 方法，虽然能开辟一个新的空间来存储数据的值，但是如果对象里面有对象的引用，也仅仅是浅复制，没有进行深复制，唯有JSON.parse(JSON.stringify(obj)) 无论对象结构里面引用了多少层的对象引用，复制之后都不会收到影响。所以变量是简单的数据对象，用扩展运算符与 Object.assign() 方法就好，如果是复杂的数据结构，建议使用JSON.parse(JSON.stringify(obj))

JS - 变量拷贝

猜你喜欢