浅拷贝:只复制引用,而未复制真正的值,改变其中一个的值,另一个的值也随之改变
深拷贝:复制真正的值,改变其中一个的值,另一个的值不会改变
assign:一级内容深拷贝,二级及以上浅拷贝 一次把深拷贝和浅拷贝都写出来
// assin:一级内容深拷贝,二级及以上浅拷贝
let obj = {name:"Tom", age:18, job:["web"]}
let objCopy = Object.assign({}, obj)//这里一定要两个参数{},不然就全是深拷贝
// 深拷贝
console.log(obj)
console.log(objCopy)
objCopy.job[0] = "IT"
console.log(obj)
console.log(objCopy)
console.log("--------------------")
// 浅拷贝
console.log(obj)
console.log(objCopy)
objCopy.name = "Mick"
console.log(obj)
console.log(objCopy)
let objCopy = Object.assign({}, obj)//这里一定要两个参数{},不然就全是浅拷贝
递归实现深拷贝
递归实现深拷贝主要是对对象的每一个属性进行递归复制。下面是一个递归实现深拷贝的基本示例:
这是简单版本的,因为只考虑到数组和对象,其他类型的没有考虑,真正的深拷贝,还会考虑到function类型,date类型等等…
function deepClone(target, map = new Map()) {
if (typeof target === 'object' && target !== null) {
// 避免循环引用问题
if (map.has(target)) {
return map.get(target);
}
// 处理数组和对象的情况
const cloneTarget = Array.isArray(target) ? [] : {};
map.set(target, cloneTarget);
for (let key in target) {
if (target.hasOwnProperty(key)) {
cloneTarget[key] = deepClone(target[key], map);
}
}
return cloneTarget;
} else {
return target;
}
}
// 示例
const obj = {
num: 0,
str: '',
boolean: true,
unf: undefined,
nul: null,
obj: { name: 'I am an object', id: 1 },
arr: [0, 1, 2],
func: function() { console.log('I am a function') },
date: new Date(0),
reg: new RegExp('/I am a regular expression/ig'),
[Symbol('key')]: 'I am a symbol',
error: new Error('I am an error object'),
map: new Map([['name', 'I am a map']]),
set: new Set([1, 'I am a set'])
};
const clonedObj = deepClone(obj);
console.log(clonedObj);
console.log(clonedObj.obj !== obj.obj); // true,说明确实进行了深拷贝
注意:这个示例并不完整,例如对于某些特殊对象(如 Function
、Date
、RegExp
、Error
、Map
、Set
等),可能还需要进行特定的处理。此外,不同的应用场景可能对深拷贝的需求有所不同,因此需要根据具体情况对上述代码进行适当的调整或扩展。