How to duplicate Javascript object properties in another object?

In JavaScript, objects are the collection of a key value pairs. The properties of the object are the keys and is denoted with a string. The value of the key is the value of the property of the given object.

In JavaScript, the objects can be copied to other by many ways in which some of them are −

Using spread operator(…)

The spread operator in JavaScript is used to copy the values of the original given object to a new object. This operator is represented by three dots(…).

Example 1

This example demonstrates how spread operator is used to copy objects in 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);

If the object has nested object, then some additional lines should be written when spread operator is used.

Using assign() function

This function is used to copy the original object into a new object. The difference in this and the spread operator is when nested objects are present and if assign() is used to copy the object, then the nested object will not change and the other variables of the object can be changed.

There are two parameters to the assign() function. The first parameter is curly braces {} which is used to ensure that the new object will not mutate the original object. The second parameter is the name of the original object which is to be copied into new object.

Syntax

Object.assign({},originalObjectName)

Example 1

Following is an example of the assign() method. In here we are creating an object and copying its contents into a new object −

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)

In the above example the original object is copied into the new object and then the properties of the objects are changed. So, from this it is concluded that we can update the values of the properties of the object after copying it from the original object.

When these are copied by using the assign() function the original value and the new copied value will have the same reference. So, change in one can alter the change in the other accordingly.

Example 2

Following is an another example of the assign() method. To copy all the properties of a source object onto a target object, you can use the following code −

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);