JavaScript 中复制对象的不同技术
在 JavaScript 中，对象是键值对的集合。对象的属性是键，用字符串表示。键的值是给定对象的属性值。
对象复制的类型/技术
任何语言中都有两种复制对象的方式，即:深层复制和浅层复制。
浅层复制
在这种技术中，对象被复制的次数尽可能少。假设如果您使用此技术复制集合，则集合的结构将被复制到目标，而不是元素。
示例
以下是浅层复制的示例 -
let innerObj = { a: 'b', c: 'd' } let obj = { x: "test", y: innerObj } // Create a shallow copy. let copyObj = Object.assign({}, obj); // Both copyObj and obj's prop y now refers to the same innerObj. Any changes to this will be reflected. innerObj.a = "test" console.log(obj) console.log(copyObj)
请注意，浅拷贝不会递归地进行克隆。它只是在顶层进行克隆。
深拷贝
在深拷贝中，对象被完全复制。集合的深拷贝是两个集合，其中原始集合中的所有元素都被克隆。
示例
以下是深拷贝的示例 -
let innerObj = { a: 'b', c: 'd' } let obj = { x: "test", y: innerObj } // Create a deep copy. let copyObj = JSON.parse(JSON.stringify(obj)) // Both copyObj and obj's prop y now refers to the same innerObj. Any changes to this will be reflected. innerObj.a = "test" console.log(obj) console.log(copyObj)
复制对象的其他方法
在 JavaScript 中，可以通过多种方式将对象复制到另一个对象，下面将讨论其中一些方法。
使用扩展运算符(…)
JavaScript 中的扩展运算符用于将原始给定对象的值复制到新对象。此运算符由三个点(…)表示。
示例
此示例演示了如何使用扩展运算符在 JavaScript 中复制对象 -
var employee = { emp_name: "Abdul Rawoof", company: "Tutorials Point", salary: 18000, job: "Software Engineer-Intern" } console.log("The original object employee is:", employee) var cpyEmployee = {...employee} console.log("The copied object cpyEmployee is:",cpyEmployee);
如果对象有嵌套对象，则使用扩展运算符时应编写一些额外的行。
使用assign()函数
此函数用于将原始对象复制到新对象中。此函数与扩展运算符的区别在于，当存在嵌套对象时，如果使用assign()复制对象，则嵌套对象不会改变，而对象的其他变量可以改变。
assign()函数有两个参数。第一个参数是花括号{}，用于确保新对象不会改变原始对象。第二个参数是要复制到新对象的原始对象的名称。
语法
以下是assign()函数的语法。
Object.assign({},originalObjectName)
示例
此示例演示了如何使用assign()将对象复制到新对象中-
var employee = { emp_name: "Abdul Rawoof", company: "Tutorials Point", salary: 18000, job: "Software Engineer-Intern" } console.log("The original object employee is:", employee) var cpyEmployee = Object.assign({},employee) console.log("The copied object cpyEmployee is:",cpyEmployee); cpyEmployee.emp_name="Jason" cpyEmployee.job="Content writer-Intern" console.log("The copied object with some different name and role is:",cpyEmployee)
在上面的例子中，原始对象被复制到新对象中，然后对象的属性被更改。因此，由此可以得出结论，我们可以在从原始对象复制对象后更新对象属性的值。
当使用 assign() 函数复制这些值时，原始值和新复制的值将具有相同的引用。因此，一个值的更改可以相应地改变另一个值的更改。
使用 JSON
这用于以快速简便的方式将原始对象复制到新对象中。当给定的输入是数字、字符串和对象文字时，可以使用此函数进行复制。
这样，必须使用两种方法来复制对象，它们是 parse() 和 stringify() 函数。Parse() 函数将字符串解析为 JavaScript 对象。通过这样做，两个对象将拥有各自的内存。
语法
json() 方法的语法如下。
JSON.parse(JSON.stringify(originalObjectName))
示例
此示例演示了如何使用 parse() 和 stringify() 复制对象 −
let employee = { emp_name: 'Abdul Rawoof', company: 'Tutorials Point', emp_id: 'TP10000', role: 'Software Engineer-Intern', salary: 18000 } let cpyEmployee = JSON.parse(JSON.stringify(employee)) console.log("This is the original object:",employee) console.log("This is the new copied object:",cpyEmployee) cpyEmployee.emp_name = 'B Jason' cpyEmployee.emp_id = 'TP9999' cpyEmployee.role = 'Content Writing-Intern' console.log("The copied object with updations is:",cpyEmployee)
