js深拷贝和浅拷贝，函数如何拷贝

我的性格比较怪
1,150 阅读5分钟

JavaScript中的拷贝（或者叫做复制）是指在一个变量或者对象上创建一个新的值或者对象，新的值或者对象在存储上与原始值或者对象不同。拷贝在JavaScript中是非常常见的，例如在创建新的数组或者对象时，或者在修改现有对象时。在拷贝时，我们需要考虑到深拷贝和浅拷贝两种方式。

浅拷贝

浅拷贝是指复制一个对象的基本结构，但是不复制对象中的嵌套对象的结构，也不复制对象的属性值，只是复制了属性的引用。也就是说，当我们使用浅拷贝时，拷贝的结果只是原始对象的一个浅层副本，只有最外层的属性被复制，而不会复制更深层次的属性。当我们修改拷贝的对象时，原始对象的值也会被修改，因为它们引用的是同一个对象。因此，浅拷贝是一种非常快速的操作，但是有时候并不安全。

在JavaScript中，可以使用Object.assign()方法来实现浅拷贝。例如，以下代码是将一个对象的属性复制到另一个对象中：

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

在这个例子中，我们使用Object.assign()方法将obj1中的属性复制到obj2中。在这个例子中，obj2是obj1的一个浅层副本。我们可以使用以下代码来验证：

console.log(obj1 === obj2); // false
console.log(obj1.b === obj2.b); // true

在上面的代码中，我们首先使用全等运算符来比较obj1和obj2是否引用同一个对象。由于它们是两个不同的对象，因此这个比较结果应该是false。然后，我们比较obj1和obj2中的b属性是否引用同一个对象。由于这个属性是一个嵌套对象，Object.assign()方法只复制了这个对象的引用，因此这个比较结果应该是true。

深拷贝

深拷贝是指创建一个完整的对象副本，包括嵌套的对象和属性值。当我们使用深拷贝时，新的对象完全独立于原始对象，即使我们修改拷贝的对象，原始对象也不会受到影响。深拷贝可能会比浅拷贝慢，因为它需要遍历整个对象树，但是在某些情况下，它是必需的，例如当我们需要创建一个完全独立的对象副本时。

在JavaScript中，可以使用JSON.parse()和JSON.stringify()方法来实现深拷贝。以下是一个使用JSON.parse()和JSON.stringify()方法实现深拷贝的例子：

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

在这个例子中，我们首先使用JSON.stringify()方法将obj1转换为JSON字符串，然后再使用JSON.parse()方法将这个JSON字符串转换回一个JavaScript对象。这样就实现了一个完全独立的对象副本，因为它是从原始对象的JSON字符串中重新创建的，而不是通过引用复制。我们可以使用以下代码来验证：

console.log(obj1 === obj2); // false
console.log(obj1.b === obj2.b); // false

在上面的代码中，我们首先使用全等运算符来比较obj1和obj2是否引用同一个对象。由于它们是两个不同的对象，因此这个比较结果应该是false。然后，我们比较obj1和obj2中的b属性是否引用同一个对象。由于我们使用了JSON.stringify()和JSON.parse()方法，因此这个比较结果应该是false，因为obj2中的b属性是一个完全独立的对象副本。

需要注意的是，使用JSON.stringify()和JSON.parse()方法实现深拷贝有一些限制。首先，它只能用于可以序列化为JSON字符串的对象，例如JavaScript中的原始类型、数组、对象、日期、正则表达式等，而不能用于函数、Map、Set、Symbol等。其次，它不能处理循环引用的对象，例如一个对象的属性引用了这个对象本身，这种情况会导致无限递归，最终导致栈溢出。在这种情况下，我们需要手动实现深拷贝，或者使用第三方库来处理循环引用的对象。

如何深拷贝一个函数

1、使用JSON.parse()和JSON.stringify()方法

可以使用JSON.parse()和JSON.stringify()方法来实现深拷贝一个函数。首先将函数转换成JSON字符串，然后再将JSON字符串转换为新的函数对象。例如：

function myFunction() {
  console.log('Hello World!');
}

let copyOfFunction = JSON.parse(JSON.stringify(myFunction));

在上述示例中，使用JSON.stringify()将函数对象转换为JSON字符串，然后使用JSON.parse()将JSON字符串转换为新的函数对象。由于使用了深拷贝，因此copyOfFunction是一个完全独立的函数副本。

需要注意的是，这种方法只适用于函数没有闭包和嵌套函数的情况。如果函数中包含了闭包或嵌套函数，则JSON.stringify()方法会将它们转换为null。因此，这种方法并不是深拷贝的最佳选择。

2、使用递归函数实现深拷贝

使用递归函数来实现深拷贝是一种更通用的方法。递归函数可以遍历函数中的所有嵌套对象和函数，并创建它们的副本。以下是一个使用递归函数实现深拷贝的示例：

function deepCopyFunction(func) {
  let copiedFunc = new Function('return ' + func.toString())();
  
  Object.keys(func).forEach(key => {
    if (typeof func[key] === 'object' && func[key] !== null) {
      copiedFunc[key] = deepCopyFunction(func[key]);
    }
  });
  
  return copiedFunc;
}

function myFunction() {
  let a = { b: 2 };
  function nestedFunction() {
    console.log('Hello Nested Function!');
  }
  return { a, nestedFunction };
}

let copyOfFunction = deepCopyFunction(myFunction);

在上述示例中，定义了一个名为deepCopyFunction的递归函数，用于深拷贝函数对象。该函数首先创建一个新的函数对象副本，然后遍历原始函数中的所有嵌套对象和函数，并递归调用deepCopyFunction()函数来创建它们的副本。

avatar
文章
阅读
粉丝