Javascript Merge Objects

#javascript #webdev #programming #codequality

In this post we will merge objects in JavaScript

const user = {
      user_id: '1#inoque@20',
      first_name: 'Francisco',
      last_name: 'Inoque',
      age: 24
    }

    const user_details = {
       obj_id: '1122@ee11',
       user_id: '1#inoque@20',
       company: 'SavanaPoint',
       role: 'Full Stack Developer',
       hobby: 'Watching Movies',
       stacks: {
        languages: ['JavaScript', 'Rust', 'Go'],
        frameworks: {
          frontend: ['Angular', 'Reactjs', 'Nextjs', 'Bootstrap'],
          backend: ['Nestjs', 'Express', 'Adonisjs', 'Nodejs'],
          database: ['MongoDB', 'FaunaDB'],
          other_tech: ['firebase', 'graphql', 'TypeScript', 'Adobe XD', 'Nodejs']
        }
      }
    }
const user_complete_details = { 
  ...user, ...user_details
}

Or we can use: Object.assign

The Object.assign () method is used to copy the values of all the own enumerable properties of one or more source objects to a target object. This method will return the target object.

 const user = {
      user_id: '1#inoque@20',
      first_name: 'Francisco',
      last_name: 'Inoque',
      age: 24
    }

    const user_details = {
       obj_id: '1122@ee11',
       user_id: '1#inoque@20',
       company: 'SavanaPoint',
       role: 'Full Stack Developer',
       hobby: 'Watching Movies',
       stacks: {
        languages: ['JavaScript', 'Rust', 'Go'],
        frameworks: {
          frontend: ['Angular', 'Reactjs', 'Nextjs', 'Bootstrap'],
          backend: ['Nestjs', 'Express', 'Adonisjs', 'Nodejs'],
          database: ['MongoDB', 'FaunaDB'],
          other_tech: ['firebase', 'graphql', 'TypeScript', 'Adobe XD', 'Nodejs']
        }
      }
    }
const user_complete_details =  Object.assign(user, user_details)

console.log(user_complete_details)

Result:

{
  user_id: '1#inoque@20',
  first_name: 'Francisco',
  last_name: 'Inoque',
  age: 24,
  obj_id: '1122@ee11',
  company: 'SavanaPoint',
  role: 'Full Stack Developer',
  hobby: 'Watching Movies',
  stacks: {
    languages: [ 'JavaScript', 'Rust', 'Go' ],
    frameworks: {
      frontend: [Array],
      backend: [Array],
      database: [Array],
      other_tech: [Array]
    }
  }
}

Or

{user_id: "1#inoque@20", first_name: "Francisco", last_name: "Inoque", age: 24, obj_id: "1122@ee11", …}
age: 24
company: "SavanaPoint"
first_name: "Francisco"
hobby: "Watching Movies"
last_name: "Inoque"
obj_id: "1122@ee11"
role: "Full Stack Developer"
stacks:
frameworks:
backend: Array(4)
0: "Nestjs"
1: "Express"
2: "Adonisjs"
3: "Nodejs"
length: 4
__proto__: Array(0)
database: Array(2)
0: "MongoDB"
1: "FaunaDB"
length: 2
__proto__: Array(0)
frontend: Array(4)
0: "Angular"
1: "Reactjs"
2: "Nextjs"
3: "Bootstrap"
length: 4
__proto__: Array(0)
other_tech: (5) ["firebase", "graphql", "TypeScript", "Adobe XD", "Nodejs"]
__proto__: Object
languages: Array(3)
0: "JavaScript"
1: "Rust"
2: "Go"
length: 3
__proto__: Array(0)
__proto__: Object
user_id: "1#inoque@20"
__proto__: Object

Quadratic AI – The Spreadsheet with AI, Code, and Connections

AI-Powered Insights: Ask questions in plain English and get instant visualizations
Multi-Language Support: Seamlessly switch between Python, SQL, and JavaScript in one workspace
Zero Setup Required: Connect to databases or drag-and-drop files straight from your browser
Live Collaboration: Work together in real-time, no matter where your team is located
Beyond Formulas: Tackle complex analysis that traditional spreadsheets can't handle

Get started for free.

Watch The Demo 📊✨