Open In App

How to Push an Object into Another Object in JavaScript ?

Last Updated : 01 Feb, 2024
Improve
Improve
Like Article
Like
Save
Share
Report

In JavaScript, an object is a fundamental data type that allows us to store and organize data using key-value pairs.

Objects are versatile and can represent complex structures, making them a crucial part of JavaScript programming.

There are several ways to push an object into another object in JavaScript, which are listed below.

Using pushedObject property

In this method, a new property is added to the target object, and the source object is assigned to that property. creating a hierarchy of objects within the target object. This method includes an entire object within another object, creating a key-value pair where the value is another object.

Example: To demonstrate pushing city information within a region object using the nested object property.

Javascript




// Using a Nested Object
 
let region =
    { name: "Western Region", subregions: {} };
let cityDetails =
    { cityName: "Mumbai", population: 12500000 };
 
// Assigning cityDetails to a property
// within the region object
region.subregions.maharashtra = cityDetails;
 
// Output
console.log(region);


Output

{
  name: 'Western Region',
  subregions: { maharashtra: { cityName: 'Mumbai', population: 12500000 } }
}

Using the spread operator (…)

The spread operator (…) is used to create a shallow copy of the target object. Properties from the source object are added or overwritten in the target object. It ensures that changes to the source object after the operation do not affect the target object.

Example: To demonstrate pushing the information about a person and their address inside the user profile using the spread operator() method.

Javascript




// Initial person information
 
let person = { name: "XYZ", age: 30 };
let address = { city: "Mumbai", state: "Maharashtra" };
 
// Creating a shallow copy of the
// user profile by spreading properties
let userProfile = { ...person, ...address };
 
// Output
console.log(userProfile);


Output

{ name: 'XYZ', age: 30, city: 'Mumbai', state: 'Maharashtra' }

Using Object.assign ()

Object.assign is used to copy properties from one or more source objects into the target object. It makes a shallow copy, and modifications to the source object after the assignment that do not affect the target object.

Example: To demonstrate pushing the information about a person and their address inside the user profile using the object.assign() method.

Javascript




// Initial person information
 
let person = { name: "XYZ", age: 30 };
let address = { city: "Mumbai", state: "Maharashtra" };
 
// Creating an user profile
//using the Object.assign()
let userProfile = Object.assign(person, address);
 
// Output
console.log(userProfile);


Output

{ name: 'XYZ', age: 30, city: 'Mumbai', state: 'Maharashtra' }


Like Article
Suggest improvement
Previous
Next
Share your thoughts in the comments

Similar Reads