JS—深拷贝与浅拷贝

拷贝原理：

javaScript中，基础类型的值是直接拷贝一份新的一模一样的数据，这2份数据，相互独立，互不影响；引用类型（Object）的复制，则是传递对象的引用，也就是对象所在的内存地址，相当于多个变量指向同一个对象，那么只要其中一个变量对这个对象进行修改，其他的变量所指向的对象也会跟着修改（因为他们指向的是同一个对象）

---

浅拷贝的5种方法：

A对B进行浅拷贝（若是基础类型，则直接拷贝值；若是引用类型，拷贝的是引用地址）

B的值就会赋予给A，A值=B值。当A值发生改变时（指向的是B的引用地址），B也同时会改变

1、Obejct . assign ( )

该函数默认是对对象进行深拷贝，但是只对最外层的进行深拷贝（当对象内嵌套对象时，被嵌套的对象依然是进行浅拷贝）。只会拷贝所有的属性值到新的对象中，如果属性值是对象的话，拷贝的是地址（2者指向的是同一个地址），因此不是深拷贝。

// 通过Obejct . assign ( ) 实现浅拷贝
let a = {
	age: 1
}
let b = Object.assign({}, a)
a.age = 2
console.log(b.age) // 1

2、... 扩展运算符 实现浅拷贝

// 通过...实现浅拷贝
let a = {
	age: 1
}
let b = { ...a }
a.age = 2
console.log(b.age) // 1

3、Array.prototype.contact ( ) 拷贝数组

4、Array.prototype.slice（）拷贝数组

5、遍历赋值

注：浅拷贝只解决了第一层的问题，如果接下去的值中还有对象的话，那么就又回到最开始的话题了， 两者享有相同的地址。要解决这个问题，我们就得使用深拷贝了。

深拷贝的3种方式：主要针对Object类型

在堆内存中为新对象开辟空间，存在与被拷贝对象同样的属性与属性值。当原对象的值发生改变时，不会影响到新对象，值也不会指向新对象的地址

1、通过  JSON.parse(JSON.stringify(object)) 解决。本质是JSON会自己构建新的内存来存放新对象。

     但会有局限性：会忽略undefined，symbol，不能序列化函数，不能解决循环引用的对象

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

2、递归实现深拷贝

function cloneDeepDi(obj){
  const newObj = {};
  let keys = Object.keys(obj);
  let key = null;
  let data = null;
  for(let i = 0; i

3、引用lodash库的_.cloneDeep( ) （最完美）

欢迎分享，转载请注明来源：内存溢出

原文地址: http://outofmemory.cn/web/1320507.html