深拷贝实现的六种方式(优缺点浅析)
深拷贝实现的几种方式:1、通过递归方式实现深拷贝;2、JSON.parse(JSON.stringify(obj));3、jQuery的extend方法实现深拷贝;4、Object.assign(obj1, obj2);5、扩展运算符;6、数组使用数组方法进行深拷贝(concat、slice)...
·
首先,我们需要简单了解什么是深拷贝,什么是浅拷贝。
深拷贝:拷贝的是对象或者数组内部数据的实体,重新开辟了内存空间存储数据;
浅拷贝:拷贝的是引用类型的指针,副本和原数组或对象指向同一个内存;
浅拷贝:
var obj = {
a: 1,
b: 2
}
var obj1 = {}
obj1 = obj//浅拷贝
console.log(obj1);//{a: 1, b: 2}
obj1.c = 3
console.log(obj);//{a: 1, b: 2, c: 3},更改obj1,obj也被改变
深拷贝的实现:
1、通过递归方式实现深拷贝
比较全面的深拷贝,缺点是较为繁琐
function deepClone(obj) {
var target = {};
for(var key in obj) {
if (Object.prototype.hasOwnProperty.call(obj, key)) {
if (typeof obj[key] === 'object') {
target[key] = deepClone(obj[key]);
} else {
target[key] = obj[key];
}
}
}
return target;
}
2、JSON.parse(JSON.stringify(obj))
满足一般使用场景,但无法实现对象中方法(fountion)的深拷贝
let obj = {
id: 1,
name: '张三',
age: 10,
}
let newObj = JSON.parse(JSON.stringify(obj))
3、jQuery的extend方法实现深拷贝
var array = [1,2,3,4];
var newArray = $.extend(true,[],array); // true为深拷贝,false为浅拷贝
4、Object.assign(obj1, obj2)---伪
只有一级属性为深拷贝,二级属性后就是浅拷贝
let obj = {
id: 1,
name: '张三',
age: 10,
}
let newObj = Object.assign({}, obj)
5、扩展运算符---伪
只有一级属性为深拷贝,二级属性后就是浅拷贝
var obj = {
a: 1,
b: 2
}
var obj1 = {...obj}
6、数组使用数组方法进行深拷贝(concat、slice)---伪
只有一级属性为深拷贝,二级属性后就是浅拷贝,如数组中的对象
var arr1 = [1, 2, 3, 4]
var arr2 = arr1.concat()
var arr3 = arr1.slice(1)
更多推荐
已为社区贡献1条内容
所有评论(0)