js 拷贝后赋值

在JavaScript中，“拷贝后赋值”通常指的是将一个变量的值复制到另一个变量中。这种操作在编程中非常常见，但也有一些细节需要注意，特别是涉及到对象和数组时。

基础概念

1. 基本类型拷贝：对于基本数据类型（如字符串、数字、布尔值、undefined、null、symbol），可以直接通过赋值操作进行拷贝。这种拷贝是深拷贝，即两个变量完全独立。
2. 引用类型拷贝：对于对象和数组等引用数据类型，赋值操作实际上只是复制了引用（内存地址），而不是对象本身。这意味着两个变量将指向同一个对象，任何对其中一个变量的修改都会影响到另一个变量。

相关优势

• 基本类型拷贝：简单、高效，两个变量完全独立，互不影响。
• 引用类型拷贝（虽然有时可能带来问题）：节省内存，因为多个变量可以共享同一个对象。

类型与应用场景

• 基本类型：适用于需要独立变量值的场景，如计数器、配置参数等。
• 引用类型：适用于需要共享数据的场景，如图形界面中的元素状态、复杂数据结构等。

问题与原因

当使用赋值操作符（=）来拷贝对象或数组时，可能会遇到意料之外的问题，因为这种拷贝只是浅拷贝，两个变量实际上指向同一个内存地址。这可能导致在一个变量上进行的修改意外地影响到另一个变量。

解决方法

1. 深拷贝：对于对象和数组，如果需要进行完全独立的拷贝，可以使用深拷贝方法。
2. 展开运算符：对于数组，可以使用展开运算符（...）来创建一个新的数组副本。

let arr1 = [1, 2, 3];
let arr2 = [...arr1];

1. Object.assign()：对于对象，可以使用 Object.assign() 方法来创建一个新的对象副本。但请注意，这只适用于浅拷贝，如果对象内部还有嵌套对象，则这些嵌套对象仍然是共享的。

let obj1 = { a: 1, b: { c: 2 } };
let obj2 = Object.assign({}, obj1);

示例代码

下面是一个使用深拷贝的示例代码，利用 JSON.parse(JSON.stringify(obj)) 方法：

let obj1 = { a: 1, b: { c: 2 } };
let obj2 = JSON.parse(JSON.stringify(obj1));

obj2.b.c = 3;

console.log(obj1.b.c); // 输出 2，因为 obj2.b 和 obj1.b 是完全独立的对象
console.log(obj2.b.c); // 输出 3

在这个示例中，obj2.b 是 obj1.b 的深拷贝，所以对 obj2.b.c 的修改不会影响到 obj1.b.c。