06-深拷贝浅拷贝有什么区别？怎么实现深拷贝

飞熊 • 2023年9月9日下午11:26 • 技术随笔 • 阅读 209

数据类型存储

两大类型：基本类型(保存在栈内存中)；复杂类型(保存在堆内存中，引用数据类型的变量是一个指向堆内存中实际对象的引用，存在栈中)

浅拷贝

浅拷贝指的是创建新的数据，这个数据有着原始数据属性值的一份精确拷贝。如果属性是基本类型，拷贝的就是基本类型的值。如是引用类型，拷贝的是内存地址

即浅拷贝是拷贝的一层，深层次的引用类型则共享内存地址

function newshallowClone(obj){
	const newObj = {};
	for(let prop in obj){
		if(obj.hasOwnProperty(prop)){
			newObj[prop] = obj[prop]
		}
	}
	return newObj;
}

在 js中，存在浅拷贝的现象有：Object.assign;Array.prototype.slice();Array.prototype.concat();使用拓展运算符实现的复制

Object.assign

var obj = {
	age:20,
	vehicle:['benben','perfect'],
	titles:{
		title1:'',
		title2:''
	},
	love:function(){
		console.log('啦啦啦啦')
	}
}
var newRes = Object.assign({},obj);
newRes.age = 22
console.log(obj.age) //20
console.log(newRes.age) //22
newRes.titles.title1 = '1245'
console.log(obj.titles.title1) //'1245'

slice()

const ness = ['s','a','m']
const ness2 = ness.slice(0)
ness2[2] = 'l';
console.log(ness) //["s", "a", "m"]
console.log(ness2) //["s", "a", "l"]

concat()

const ness = ['s','a','m']
const ness2 = ness.concat()
ness2[1] = 'l'
console.log(ness)
console.log(ness2)

拓展运算符

const ness = ['s','a','m']
const ness2 = [...ness]
ness2[1] = 'l';
console.log(ness)
console.log(ness2)

深拷贝

深拷贝:开辟一个新的栈，两个对象的属性完全相同，但是，两个对应不同的地址，修改一个对象的属性，不会改变另一个对象的属性。

场景方式：_.cloneDeep()第三方封装的;jQuery.extend();JSON.stringify();循环递归

_.cloneDeep()

const _ = require("lodash")
const ness = {
	l:188,
	ss:{f:{t:78}},
};
const ness1 = _.cloneDeep(ness);
console.log(ness.ss.f===ness1.ss.f);// false

jQuery.extend()

const $ = require("jquery");
const ness = {
	l:188,
	ss:{f:{t:78}},
	he:[la,ll,mm]
};
const ness2 = $.extend(true,{},ness);
console.log(ness2.ss.f === ness.ss.f);// false

JSON.stringify()

const ness = {
	l:188,
	ss:{f:{t:78}},
	he:['la','ll','mm']
};
const ness3 = JSON.parse(JSON.stringify(ness));
console.log(ness3) // 存在弊端 会忽略 undefined symbol 和函数