JavaScript前端面试题——深拷贝及浅拷贝

深拷贝和浅拷贝的概念

深拷贝和浅拷贝是复制数据结构的两种不同方式。

浅拷贝是指创建一个新对象，但仅复制原对象的属性引用，而不是其属性值。即，如果原对象的属性值是对象或数组，浅拷贝后的新对象会引用相同的内存地址，因此修改内层对象会影响到原对象。（简单数据类型拷贝值，引用数据类型拷贝地址）

深拷贝是创建一个新的对象，并复制原始对象的所有属性，包括嵌套的对象和数组。这意味着在原始对象或新对象上的更改不会相互影响。

浅拷贝实现方法

使用 Object.assign()

// 原始对象
const original = {
    name: 'Alice',
    age: 30,
    hobbies: ['reading', 'hiking']
};

// 使用 Object.assign() 创建一个浅拷贝
const copy = Object.assign({}, original);

// 修改拷贝对象的属性
copy.name = 'Bob';
copy.hobbies.push('cooking');

// 输出原始对象和拷贝对象
console.log('Original:', original); // Original: { name: 'Alice', age: 30, hobbies: ['reading', 'hiking', 'cooking'] }
console.log('Copy:', copy);         // Copy: { name: 'Bob', age: 30, hobbies: ['reading', 'hiking', 'cooking'] }

在这个例子中，original 对象的 hobbies 数组被浅拷贝到 copy 对象中，所以修改 copy 对象的 hobbies 数组也会影响到 original 对象的 hobbies 数组。

使用扩展运算符（...）

// 原始对象
const original = {
    name: 'Alice',
    age: 30,
    hobbies: ['reading', 'hiking']
};

// 使用扩展运算符创建一个浅拷贝
const copy = { ...original };

// 修改拷贝对象的属性
copy.name = 'Bob';
copy.hobbies.push('cooking');

// 输出原始对象和拷贝对象
console.log('Original:', original); // Original: { name: 'Alice', age: 30, hobbies: ['reading', 'hiking', 'cooking'] }
console.log('Copy:', copy);         // Copy: { name: 'Bob', age: 30, hobbies: ['reading', 'hiking', 'cooking'] }

类似于 Object.assign()，扩展运算符创建的拷贝对象在遇到引用类型的属性时也只会复制其引用，这意味着修改数组或对象属性会同时影响原始对象。

深拷贝实现方法

ISON.parse()和JSON.stringify()方法

这是实现深拷贝的一种简单方式，但它有一些限制&#