浅拷贝
在JavaScript中,有几种实现浅拷贝的方法。浅拷贝会复制对象的属性值,但是如果属性值是对象的话,它们仍然会共享同一个引用。以下是几种常见的浅拷贝方法:
1、对象展开运算符(Spread Operator):这是一种简单且常见的浅拷贝方法。它使用 … 操作符来将一个对象的属性复制到另一个对象中。
const originalObj = { a: 1, b: 2 };
const shallowCopy = { ...originalObj };
2、Object.assign() 方法:这个方法可以用来将所有可枚举属性的值从一个或多个源对象复制到目标对象。
const originalObj = { a: 1, b: 2 };
const shallowCopy = Object.assign({}, originalObj);
3、Array.prototype.slice() 方法:这个方法对于数组的浅拷贝也是有效的。
const originalArray = [1, 2, 3];
const shallowCopy = originalArray.slice();
5、Array.prototype.concat() 方法:对于数组也可以使用 concat 方法进行浅拷贝。
const originalArray = [1, 2, 3];
const shallowCopy = originalArray.concat();
6、Array.from() 方法:这个方法可以将类数组对象或可迭代对象转换为真正的数组,也可以用于浅拷贝。
const originalArray = [1, 2, 3];
const shallowCopy = Array.from(originalArray);
深拷贝
深拷贝是指在拷贝对象或数组时,不仅复制其属性或元素的值,还要递归地复制其内部的所有对象或数组,确保拷贝后的对象或数组与原始对象或数组完全独立,彼此之间不会共享任何引用。在JavaScript中,实现深拷贝相对比较复杂,因为需要处理对象的嵌套结构和循环引用等情况。以下是几种实现深拷贝的方法:
1、递归实现:递归地遍历对象或数组,对每个属性或元素进行复制,并在遇到对象或数组时递归调用深拷贝函数。
function deepCopy(data) {if (typeof data !== 'object' || data === null) {return data; // 非对象直接返回}let copied = Array.isArray(data) ? [] : {};for (let key in data) {if (data.hasOwnProperty(key)) {// 递归复制子对象或子数组copied[key] = deepCopy(data[key]); }}return copied;
}
2、JSON 序列化与反序列化:利用JSON.stringify()将对象转换为JSON字符串,再利用JSON.parse()将JSON字符串解析为新的对象。这种方法简单易行,但是对于包含函数、正则表达式等特殊类型的属性会丢失。
function deepCopy(obj) {return JSON.parse(JSON.stringify(obj));
}