浅拷贝和深拷贝的概念
浅拷贝:它是把原来的变量地址给了另一个,他们是会相互影响,其中一个改变会影响另一个的改变,它们之间的地址都是同一个地址,所以它们会互相影响。浅拷贝也称为引用拷贝。
深拷贝:它会先开辟新的空间,然后把要拷贝的属性和方法复制进去,使这个对象指向这个地址。它们之间就不会互相影响,因为它们指向不同的地址与浅拷贝不同,它们虽然属性、方法一样,但它们是两个不一样的个体。 深拷贝也称为值拷贝。
- 浅拷贝的几种方法
1.使用 for in 循环进行浅拷贝
let obj = {
id: 1,
name: '张三',
msg: {
age: 18
}
};
let o = {};
for (const key in obj) {
o[key] = obj[key];
}
console.log(o);
2.使用ES6中的语法 assign
let obj = {
id: 1,
name: '张三',
msg: {
age: 18
}
};
let o = {};
Object.assign(o, obj);
console.log(o);
3.使用 扩展运算符 ...
let obj = {
id: 1,
name: '张三',
msg: {
age: 18
}
};
let o = {
...obj
};
console.log(o);
4.只适用于数组concat
let arr1 = [1, 3, {
id: 1,
name: '张三',
msg: {
age: 18
}
}];
let arr2 = arr1.concat();
console.log(arr2);
5.也只适用于数组slice
let arr1 = [1, 3, {
id: 1,
name: '张三',
msg: {
age: 18
}
}];
let arr2 = arr1.slice();
console.log(arr2);
- JSON.parse(JSON.stringify()) 深拷贝方法
let obj = {
id: 1,
name: '张三',
msg: {
age: 18,
name: '李四',
msgs: {
age: 19,
name: '王五'
}
}
};
let o = JSON.parse(JSON.stringify(obj));
console.log(o);
2.使用 递归 的方法
let obj = {
id: 1,
name: '张三',
msg: {
age: 18,
name: '李四',
msgs: {
age: 19,
name: '王五'
}
}
};
let o = {};
function fn(newObj, oldObj) {
for (let key in oldObj) {
let item = oldObj[key];
if (item instanceof Array) {
newObj[key] = [];
fn(newObj[key], item)
} else if (item instanceof Object) {
newObj[key] = {};
fn(newObj[key], item);
} else {
newObj[key] = item;
}
}
}
fn(o, obj);
console.log(o);