js 拷贝(JS复制代码实现)

什么是JS拷贝

JS拷贝指的是JavaScript中复制（也称拷贝）一个对象或者值到另一个变量，它们在不同的内存地址上，所以对被复制的值的修改不会影响另一个变量的值。JS拷贝可以分为浅拷贝和深拷贝。

浅拷贝

浅拷贝是指复制一个对象时只复制其基本类型的值和一级属性的引用，而不会复制属性值的所有嵌套子对象。当需要修改嵌套子对象的属性时，会影响其他引用该对象的变量。在JavaScript中，通常可以使用Object.assign()和展开运算符（...）进行浅拷贝。

Object.assign()

Object.assign()方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。该方法第一个参数是目标对象，第二个及后续参数是源对象。Object.assign()方法会返回目标对象，如果多个源对象具有相同的属性，则后面的属性会覆盖前面的属性。

const obj1 = {a: 1, b: 2};

const obj2 = {b: 3, c: 4};
const obj3 = Object.assign(obj1, obj2);
console.log(obj1); // {a: 1, b: 3, c: 4}
console.log(obj2); // {b: 3, c: 4}
console.log(obj3); // {a: 1, b: 3, c: 4}

展开运算符（...）

展开运算符（...）可将数组或对象展开，浅拷贝对象时常用于无需手动指定源对象的情况。

const obj1 = {a: 1, b: 2};

const obj2 = {...obj1, b: 3, c: 4};
console.log(obj1); // {a: 1, b: 2}
console.log(obj2); // {a: 1, b: 3, c: 4}

深拷贝

深拷贝是指完全复制一个对象和其所有嵌套子对象，新对象和原对象的每个属性值都是相互独立的，修改新对象的属性值不会改变原对象和其他引用该对象的变量的值。在JavaScript中，深拷贝通常使用JSON.parse()和JSON.stringify()或第三方库（如lodash等）。

JSON.parse()和JSON.stringify()

JSON.parse()方法从一个字符串中解析出JSON对象，而JSON.stringify()方法将一个对象或值转换为JSON字符串。

const obj1 = {a: 1, b: {c: 2}};

const obj2 = JSON.parse(JSON.stringify(obj1));
console.log(obj1); // {a: 1, b: {c: 2}}
console.log(obj2); // {a: 1, b: {c: 2}}
obj2.b.c = 3;
console.log(obj1); // {a: 1, b: {c: 2}}
console.log(obj2); // {a: 1, b: {c: 3}}

第三方库

如lodash等第三方库提供了更完善、灵活、高效的深拷贝方法。以下是使用lodash库的深拷贝实例：

const _ = require('lodash');

const obj1 = {a: 1, b: {c: 2}};
const obj2 = _.cloneDeep(obj1);
console.log(obj1); // {a: 1, b: {c: 2}}
console.log(obj2); // {a: 1, b: {c: 2}}
obj2.b.c = 3;
console.log(obj1); // {a: 1, b: {c: 2}}
console.log(obj2); // {a: 1, b: {c: 3}}

JS拷贝的应用

JS拷贝在编程中有广泛的应用，在以下情况中经常使用JS拷贝：

对象或数组属性的快速复制/合并

对象或数组的深度比较

数组或对象的复制并进行不同的操作，例如数组去重、合并等操作

优化函数的性能

小结

JS拷贝是编程中非常常用的操作，通过浅拷贝和深拷贝可以达到复制对象或值的目的。在使用浅拷贝时通常使用Object.assign()和展开运算符（...），而使用深拷贝时通常使用JSON.parse()和JSON.stringify()或第三方库（如lodash等）。在使用JS拷贝时需要注意对象或数组的结构以及引用关系。通过合理的使用JS拷贝可以提高程序的性能和可读性。