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

数据类型存储

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

浅拷贝

浅拷贝 指的是创建新的数据,这个数据有着原始数据属性值的一份精确拷贝。如果属性是基本类型,拷贝的就是基本类型的值。如是引用类型,拷贝的是内存地址
即浅拷贝是拷贝的一层,深层次的引用类型则共享内存地址
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 和函数
都创建出一个新的对象,但是复制对象属性的时候,行为就不一样
浅拷贝 只复制属性指向某个对象的指针,而不复制对象本身,新旧对象还是共享同一内存,修改对象属性会影响原对象
深拷贝 会另外创造一个一样的对象,新对象和原对象不共享内存,修改新的不影响旧对象

拷贝类型为引用类型时:

浅拷贝是复制内存中的地址,拷贝前后的对象,共享了同一块内存,修改会相互影响。
深拷贝 是递归拷贝深层次,属性为对象时,深拷贝是新开栈,指向的是新地址,所以互不影响

相比于npm和yarn,pnpm的优势是什么?

简要:更快速的依赖下载;更高效的利用磁盘空间;更高效的依赖管理;
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值