深拷贝与浅拷贝的三个妙招

在广袤无垠的代码海洋中，深拷贝和浅拷贝就好似两艘并驾齐驱的帆船，它们在数据复制的惊涛骇浪中穿梭，留下截然不同的航迹。了解它们的差异和应用场景，对于程序员来说至关重要，就好似掌握了航海图，方能在这片代码汪洋中乘风破浪。

浅尝辄止的浅拷贝

浅拷贝就好比蜻蜓点水，它只复制对象或数组的引用，却不对其包含的原始值进行复制。当对浅拷贝的对象或数组进行修改时，原始对象或数组也会受到影响，就好似孪生兄弟，一人咳嗽，另一人也跟着打喷嚏。

在JavaScript中，使用赋值运算符(=)进行赋值时，默认就是浅拷贝。以下代码展示了浅拷贝的特性：

const original = { name: "John Doe" };
const copy = original;

copy.name = "Jane Doe";

console.log(original); // { name: "Jane Doe" }

深海寻宝的深拷贝

深拷贝则更像是一场深海寻宝，它不仅复制对象的引用，还会逐一复制其包含的所有原始值，创造一个全新的对象。对深拷贝对象进行修改时，原始对象不受影响，就好似双胞胎，一人感冒，另一人安然无恙。

在JavaScript中，可以通过以下三种方式实现深拷贝：

1. 使用JSON.parse(JSON.stringify())

const original = { name: "John Doe" };
const copy = JSON.parse(JSON.stringify(original));

copy.name = "Jane Doe";

console.log(original); // { name: "John Doe" }

2. 使用递归

function deepCopy(obj) {
  if (Array.isArray(obj)) {
    return obj.map(deepCopy);
  } else if (typeof obj === "object") {
    const copy = {};
    for (const key in obj) {
      copy[key] = deepCopy(obj[key]);
    }
    return copy;
  } else {
    return obj;
  }
}

3. 使用Lodash库

const { cloneDeep } = require("lodash");

const original = { name: "John Doe" };
const copy = cloneDeep(original);

copy.name = "Jane Doe";

console.log(original); // { name: "John Doe" }

举个栗子

假设我们有一个包含用户数据的对象，并且希望对该对象进行修改。如果使用浅拷贝，任何对副本的修改都会同时影响原始对象，从而可能导致意外后果。而通过深拷贝，我们创建了一个与原始对象完全独立的副本，可以对其进行任意修改，而不会影响原始对象。

航海总结

深拷贝和浅拷贝是两个截然不同的概念，理解它们的差异和应用场景对于编写健壮且可维护的代码至关重要。就像航海家熟练掌握航海图，程序员也应熟练掌握深拷贝和浅拷贝的技术，才能在代码的汪洋中乘风破浪，抵达成功的彼岸。