深拷贝和浅拷贝的学习记录
铺垫知识:基本数据类型和引用数据类型
基本数据类型: undefined、null、number、string、boolean、symbool
引用数据类型:统称Object类型, 例如:Function、Array、Date、String、Number等
数据类型储存方式:
1. 基本数据类型的变量名和值储存在栈内存中
let [a, b] = [1];
b = a // 为b单独分配栈内存
key | valie |
a | 1 |
b | 1 |
2. 引用数据类型的变量名储存在栈内存,值存于堆内存,栈中提供一个指向堆内存中的值的引用地址
let obj = {
a: 1,
c: { b: 2 }
}
let newObj = obj
newObj.a = 2
// newObj: {/ a: 2; c: { b: 2 } }
// obj: {/ a: 2; c: { b: 2 } }
浅拷贝:创建一个新的数据,这个数据有着原始数据属性的一份精确拷贝。如果属性是基本数据类型,拷贝的就是基本数据类型的值;如果是引用数据类型,拷贝的就是堆内存地址,所以改变其中一个数据的这个属性的地址,另一个值也会受到影响。
缺点:只解决了第一层数据的问题,无法拷贝深层数据
深拷贝:拷贝对象所有的属性,并拷贝属性指向的动态分配的内存。拷贝后的对象与原对象相互分离互不影响。
深拷贝实现方式:
1. Object.assign()。该方式进行的是浅拷贝,拷贝的是对象的属性的引用,而不是对象本身。但对一层数据来说可以实现深拷贝;对于深层数据,
2. 递归实现
function deepClone (obj) {
let result = Array.isArray(obj) ? [] : {}
// for...in 遍历obj全部的可枚举属性,包括自身和圆形属性
for (let key in obj) {
if (obj.hasOwnProperty(key)) {
// 包含自身属性
if (obj[key] && typeof obj[key] === 'object') {
result[key] = deepClone(obj[key])
} else {
result[key] = obj[key]
}
}
}
return result
}
3. JSON.parse(JSON.stringify(obj)): 可以实现深拷贝
缺点: 1, 会忽略undefined、symbol和函数
let obj = {
name: 'wa kao',
age: undefined,
hobby: Symbol('hobby'),
check: function () {}
}
let obj2 = JSON.parse(JSON.stringify(obj))
console.log(obj2) // { name: 'wa kao' }
2. 对象循环引用时会报错
3. new Date的转换结果不正确