js深克隆方法封装

前端该溜子

于 2023-05-12 20:23:10 发布

阅读量117

点赞数

分类专栏：深度克隆面试文章标签： javascript 前端开发语言

本文链接：https://blog.youkuaiyun.com/xye1230/article/details/130649377

版权

深度克隆同时被 2 个专栏收录

1 篇文章

订阅专栏

面试

1 篇文章

订阅专栏

文章介绍了JavaScript中浅克隆和深克隆的概念。浅克隆是简单的赋值操作，导致两个变量指向同一内存地址，改变一个会影响另一个。而深克隆则是创建独立副本，即使原对象改变，副本也不会受影响。文中提供了一个使用递归实现深克隆的函数示例，特别提到了在处理包含Symbol类型属性的对象时使用Reflect.ownKeys()的必要性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

浅克隆

就是平时的赋值，赋值之后指针指到同一个栈堆，那么我无论改变哪一个值，另外一个赋值或者被赋值的变量都会同时被改变

var num1 = 10;
var num2 = num1;
num2 = 11;
console.log(num1,num2);	// 11,11

深克隆

就是我虽然继承与你，但是我与你是两个独立的个体，两者任意谁的改变都无法改变对方
其次考虑到适应数据的复杂程度，一般是用递归

const oldObj = {
	name:'jack',
	age:20,
	friend:{
		name:'king',
	}
}
function deepClone(obj = {}){
	if(typeof obj !== 'object' || obj == null){
		return obj
	}
	let result;
	if(obj instanceof Array){
		result = []
	}else{
		result = {}
	}

	// 说一些这里为什么用Reflect.ownKeys()
	// 正常来讲直接obj是可以的，但如果你的对象元素里面有Symbol类型，那for of的方法就会遍历不出来
	for(let key of Reflect.ownKeys(obj)){
		if(obj.hasOwnProperty(key)){
			result[key] = deepClone(obj[key])
		}
	}
	return result;
}

// 那么即使当我改变obj的friend元素，也会随之改变
const newObj = deepClone(oldObj)
newObj.friend.name = 'louse';