Javascript Merge Objects

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#in…

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

Print Share Comment Cite Upload Translate
APA
Francisco Inoque | Sciencx (2024-03-29T07:38:16+00:00) » Javascript Merge Objects. Retrieved from https://www.scien.cx/2021/04/12/javascript-merge-objects/.
MLA
" » Javascript Merge Objects." Francisco Inoque | Sciencx - Monday April 12, 2021, https://www.scien.cx/2021/04/12/javascript-merge-objects/
HARVARD
Francisco Inoque | Sciencx Monday April 12, 2021 » Javascript Merge Objects., viewed 2024-03-29T07:38:16+00:00,<https://www.scien.cx/2021/04/12/javascript-merge-objects/>
VANCOUVER
Francisco Inoque | Sciencx - » Javascript Merge Objects. [Internet]. [Accessed 2024-03-29T07:38:16+00:00]. Available from: https://www.scien.cx/2021/04/12/javascript-merge-objects/
CHICAGO
" » Javascript Merge Objects." Francisco Inoque | Sciencx - Accessed 2024-03-29T07:38:16+00:00. https://www.scien.cx/2021/04/12/javascript-merge-objects/
IEEE
" » Javascript Merge Objects." Francisco Inoque | Sciencx [Online]. Available: https://www.scien.cx/2021/04/12/javascript-merge-objects/. [Accessed: 2024-03-29T07:38:16+00:00]
rf:citation
» Javascript Merge Objects | Francisco Inoque | Sciencx | https://www.scien.cx/2021/04/12/javascript-merge-objects/ | 2024-03-29T07:38:16+00:00
https://github.com/addpipe/simple-recorderjs-demo