（十二）关于深浅拷贝

聊及深浅拷贝通常出现在这种情况下；讲一个变量值赋值给另外一个变量之后，当改变其中一方另外一方也会随之改变；这是由于赋值时候是赋值的是引用地址，而并非重新拷贝到另外一个内存之中。

浅拷贝（浅拷贝有两种解决方案）

• 方案一：Object.assign

  • Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象

//Object.assign()的用法
const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };

const returnedTarget = Object.assign(target, source);

console.log(target);			//{ a: 1, b: 4, c: 5 }
console.log(returnedTarget);		//{ a: 1, b: 4, c: 5 }

//浅拷贝中的用法
let a = {age:1}
let b = Object.assign({},a)
a.age = 2;
console.log(a);		//{age:2}
console.log(b);		//{age:1}

• 方案二：展开运算符…

let a = {age:1};
let b = {...a}
a.age = 2;
console.log(a);		//{age:2}
console.log(b);		//{age:1}

• 浅拷贝无法解决的问题：

let a = {
	age:1,
	jobs:{
		first:'web'
	}
}
let b = {...a};
a.jobs.first = 'engineer';
console.log(a.jobs.first);		//engineer
console.log(b.jobs.first);		//engineer

深拷贝

• 方案一:JSON.parse(JSON.stringify(object))

  • 该方案也存在一些问题：
    • 会忽略undefined
    • 会忽略symbol
    • 不能序列化函数
    • 不能解决循环应用对象的问题

let a = {
	age:1,
	jobs:{
		first:'web'
	}
}
let b = JSON.parse(JSON.stringify(a));
a.jobs.first = 'engineer';
console.log(a.jobs.first);		//engineer
console.log(b.jobs.first);		//web