逃离赋值泥潭：深入浅出 JavaScript 赋值、浅复制、深复制

浅谈 JavaScript 赋值、浅复制、深复制的奥秘，让你快速入门

一提到 JavaScript 中的变量赋值，我们就会想到使用等号（=）操作符来完成。然而，当涉及到对象和数组时，情况就变得更加复杂了，因为我们可能会遇到浅复制和深复制的问题。

浅复制和深复制之间的关键区别在于复制的对象是否包含了对原始对象的引用。在浅复制中，新对象只包含对原始对象的引用，这意味着对新对象所做的任何更改都会影响原始对象。而在深复制中，新对象包含了原始对象的完整副本，因此对新对象所做的更改不会影响原始对象。

举个例子，假设我们有一个名为 person 的对象，它包含了 name 和 age 两个属性。

const person = {
  name: 'John Doe',
  age: 30,
};

现在，我们使用浅复制的方式创建了一个新的对象，名为 personCopy：

const personCopy = person;

在浅复制中，personCopy 只包含了对 person 对象的引用，而不是 person 对象的副本。因此，如果我们更改了 personCopy 的 name 属性，那么 person 对象的 name 属性也会随之改变。

personCopy.name = 'Jane Doe';

console.log(person.name); // 输出：Jane Doe

另一方面，如果我们使用深复制的方式创建了一个新的对象，名为 personDeepCopy，那么 personDeepCopy 将包含 person 对象的完整副本，而不是对 person 对象的引用。因此，如果我们更改了 personDeepCopy 的 name 属性，那么 person 对象的 name 属性不会受到影响。

const personDeepCopy = JSON.parse(JSON.stringify(person));

personDeepCopy.name = 'Jane Doe';

console.log(person.name); // 输出：John Doe

在 JavaScript 中，有许多方法可以实现浅复制和深复制。最常见的方法是使用对象扩展运算符（...）和 JSON.parse() / JSON.stringify() 方法。

浅复制：

const personCopy = { ...person };

深复制：

const personDeepCopy = JSON.parse(JSON.stringify(person));

除了浅复制和深复制之外，JavaScript 中还有一种叫做 "引用赋值" 的操作。引用赋值是指将一个变量的引用赋值给另一个变量。引用赋值与浅复制非常相似，因为新变量只包含了对原始变量的引用。因此，对新变量所做的任何更改都会影响原始变量。

const personRef = person;

personRef.name = 'Jane Doe';

console.log(person.name); // 输出：Jane Doe

理解 JavaScript 中的赋值、浅复制、深复制和引用赋值对于编写健壮可靠的代码非常重要。通过理解这些概念，你可以确保对数据的操作符合你的预期。

总之，浅复制和深复制是 JavaScript 中两种重要的数据操作方式。浅复制只复制对象或数组的引用，而深复制则复制对象或数组的完整副本。在实际开发中，根据具体情况选择合适的复制方式，可以有效地避免因数据引用而产生