青海旅游的网站建设,湖南盈达电力建设有限公网站,net开发的网站开发网站,保定网页模板建站JavaScript 里的深拷贝和浅拷贝
JS中数据类型分为基本数据类型和引用数据类型。
基本类型值指的是那些保存在栈内存中的简单数据段。包含Number#xff0c;String#xff0c;Boolean#xff0c;Null#xff0c;Undefined #xff0c;Symbol。
引用类型值指的是那些保存…JavaScript 里的深拷贝和浅拷贝
JS中数据类型分为基本数据类型和引用数据类型。
基本类型值指的是那些保存在栈内存中的简单数据段。包含NumberStringBooleanNullUndefined Symbol。
引用类型值指的是那些保存在堆内存中的对象所以引用类型的值保存的是一个指针这个指针指向对象的地址。引用类型包含Object 类型、Array 类型、Date 类型、RegExp 类型、Function 类型 等。
因为引用类型保存的是指向存储地址的指针所以我们直接把一个引用类型赋值给另外一个引用类型时候相当于是把指针赋值过去实际上两个对象的存储地址是一样的。因此也就导致这两个对象共用地址只要地址里的数据被修改后两个对象的值都会改变。
浅拷贝的实现方式
1.Array.concat()
const arr [1,2,3];
const copy arr.concat();
console.log(copy); // 输出: [1, 2, 3]2.Object.assign()
const arr [1,2,3];
const copy1 Object.assign({}, arr);
console.log(copy); // 输出: [1, 2, 3]3.slice()
const arr [1,2,3];
let copy arr.slice();
console.log(copy); // 输出: [1, 2, 3]4.扩展运算符 …
const arr [1,2,3];
const copy [...arr];
console.log(copy); // 输出: [1, 2, 3]深拷贝
1.JSON.parse()和JSON.stringify()
const obj1 {x: 1, y: {m: 1}
};
const obj2 JSON.parse(JSON.stringify(obj1));
console.log(obj2) //{x: 1, y: {m: 1}}1.这是最简单的方法之一但它有一些限制比如不能正确处理函数、undefined、Symbol、循环引用等特殊类型的值。
2.它会抛弃对象的constructor。也就是深拷贝之后不管这个对象原来的构造函数是什么在深拷贝之后都会变成Object
3.如果对象中存在循环引用的情况无法正确处理。
2. 递归复制
通过递归函数手动复制对象的每个属性。这种方法可以处理更复杂的对象和特殊情况如循环引用。
function deepClone(obj, hash new WeakMap()) { if (obj null) return null; // null 的情况 if (obj instanceof Date) return new Date(obj); // 日期对象直接返回一个新的日期对象 if (obj instanceof RegExp) return new RegExp(obj); // 正则对象直接返回一个新的正则对象 //hash判断该属性是否被复制// 如果循环引用了就用 weakMap 来解决 if (hash.has(obj)) return hash.get(obj); let allDesc Object.getOwnPropertyDescriptors(obj); let cloneObj Object.create(Object.getPrototypeOf(obj), allDesc); hash.set(obj, cloneObj); for (let key of Reflect.ownKeys(obj)) { if (typeof obj[key] object obj[key] ! null) { cloneObj[key] deepClone(obj[key], hash); } else { cloneObj[key] obj[key]; } } return cloneObj;
} // 使用示例
let original { a: 1, b: { c: 2 } };
original.b.d original; // 创建一个循环引用
let clone deepClone(original);
console.log(clone);
