深拷贝与浅拷贝

164 阅读2分钟

前言

这东西是写前端必须要会的东西,虽然也有很多库可以实现,但是还是自己会实现的比较好。学会造轮子

前奏(我自己的理解)

基本内型:值直接存储在栈中,复制的时候是直接的值传递,所有不存在深浅拷贝 引用内型:存储地址分为堆和栈,栈里面储存的是引用内型的地址,堆是存储引用内型的数据。直接复制的时候,是地址的复制,真正的数据没有完成复制,而只是地址的复制。 这样就会涉及到深拷贝

这就来了(上代码吧)

    // 单独数组	 还有一些方法就不一一举例了
	let a = [1,2,3,4]
	let b = []
	a.map(item=>{
		return b.push(item)
	})
	b[0] = 10
	console.log(b)
	console.log(a)
// 单独对象
// 方法1:循环
let c = {
	a:1,
	b:2,
	c:3
}
let d ={}
for(let i in c){
	d[i] = c[i]
}
d.a = 11
console.log(c)
console.log(d)
// 方法2:Object.assign
// Object.assign:用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target),并返回合并后的target
// 用法: Object.assign(target, source1, source2);  所以 copyObj = Object.assign({}, obj);  这段代码将会把obj中的一级属性都拷贝到 {}中,然后将其返回赋给copyOb
let e ={}
Object.assign(e,c)
e.a = 13
console.log(e)
// 方法3:扩展运算符
// 扩展运算符(...)用于取出参数对象的所有可遍历属性,拷贝到当前对象之中
let f = {}
f = {...c}
f.a = 123
console.log(f)
console.log(c)
// 比较复杂的情况,使用递归函数
	function deepClone(obj){
		// 如果return 空, 那边深拷贝之后的数据就是undefined
			if(typeof obj !== 'object') return obj
			let result
			if(obj instanceof Array){
				result = []
			} else {
				result = {}
			}
		for(let i in obj){
			if(obj.hasOwnProperty(i)){
				if(obj[i] && typeof obj[i] === 'object' && obj[i].constructor !== RegExp){
					result[i] = deepClone(obj[i])
				}else{
					result[i] = obj[i]
				}
			}
		}
		return result
	}
	let aa = [1,2,3,{
		A:'11'
	},{B:'22'}]
	let bb = deepClone(aa)
	bb[3].A = '1111'
			
			
			let cc = "a"
			let dd = deepClone(cc)
			console.log(dd)
			console.log(aa, '---aa')
			console.log(bb, '---bb')

有错误之处,请留言指出