如何在另一个对象中复制 Javascript 对象属性?

javascriptweb developmentfront end technology

在 JavaScript 中,对象是键值对的集合。对象的属性是键,用字符串表示。键的值是给定对象的属性值。

在 JavaScript 中,可以通过多种方式将对象复制到其他对象,其中一些是 −

使用扩展运算符(…)

JavaScript 中的扩展运算符用于将原始给定对象的值复制到新对象。此运算符由三个点(…)表示。

示例 1

此示例演示了如何使用扩展运算符复制 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()函数有两个参数。第一个参数是花括号{},用于确保新对象不会改变原始对象。第二个参数是要复制到新对象的原始对象的名称。

语法

Object.assign({},originalObjectName)

示例1

以下是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()函数复制这些值时,原始值和新复制的值将具有相同的引用。因此,一个值的更改可以相应地改变另一个值的更改。

示例2

以下是assign()方法的另一个示例。要将源对象的所有属性复制到目标对象上,可以使用以下代码-

const targetObj = { a: 1, b: 2 }; const sourceObj = { b: 4, c: 5 }; const returnedTarget = Object.assign(targetObj, sourceObj); console.log(targetObj); console.log(returnedTarget); console.log(returnedTarget === targetObj); console.log(sourceObj);

相关文章