Add object to object JavaScript

To add an object to another object in JavaScript, you can use the dot notation or square bracket notation to create a new property on the object. This can be done by assigning the object you want to add as a value to a new or existing property of the original object.

Dot notation:

object1.newProperty = object2;

Square bracket notation:

object1['newProperty'] = object2;

Both dot notation and square bracket notation achieve the same result, and the choice of which to use is a matter of personal preference.

Add the object to object JavaScript example

Simple example code adds an object to another object in JavaScript using either dot notation or square bracket notation.

const person = {
  name: 'John',
  age: 30
};

const address = {
  street: '123 Main St',
  city: 'New York',
  state: 'NY'
};

person.address = address; // Using dot notation

person['phone'] = '555-555-5555'; // Using square bracket notation

console.log(person);

Output:

Using square bracket notation, the code would look like this:

let obj1 = { name: "John", age: 30 };
let obj2 = { city: "New York" };

obj1["address"] = obj2;

console.log(obj1); // { name: "John", age: 30, address: { city: "New York" } }

and using dot notation:

let obj1 = { name: "John", age: 30 };
let obj2 = { city: "New York" };

obj1.address = obj2;

console.log(obj1); // { name: "John", age: 30, address: { city: "New York" } }

Add Multiple objects

You can add multiple objects to an existing object in JavaScript by creating new properties on the existing object and setting their values to the new objects.

const person = {
  name: 'John',
  age: 30
};

const address = {
  street: '123 Main St',
  city: 'New York',
  state: 'NY'
};

const job = {
  title: 'Software Engineer',
  company: 'Acme Inc.'
};

person.address = address;
person.job = job;

console.log(person);

Using a loop

const person = {
  name: 'John',
  age: 30
};

const addresses = [  {    street: '123 Main St',    city: 'New York',    state: 'NY'  },  {    street: '456 Maple Ave',    city: 'Los Angeles',    state: 'CA'  }];

for (let i = 0; i < addresses.length; i++) {
  person[`address${i+1}`] = addresses[i];
}

console.log(person);

Add object to object Using dot vs bracket notation in JavaScript

Both dot notation and bracket notation have their advantages and disadvantages, and which one is “better” depends on the specific situation and context. Here are some factors to consider when choosing between dot notation and bracket notation:

Comment if you have any doubts or suggestions on this JS object topic.

Note: The All JS Examples codes are tested on the Firefox browser and the Chrome browser.

OS: Windows 10

Code: HTML 5 Version