How to merge multiple objects as separate objects

Question

I am using Vue.js and I have 2 objects that I would like to combine together but to keep them separated.

I tried to use a spread such as var obj1 = {...obj2, ...obj3} but realized that this was overwriting values because names were the same. I changed the billing address information to have "billing" in front of them and using that same process again, its just a very long list and not very clean to me.

Below are the 2 objects that I am trying to combine.

deliveryAddress: {
                firstName: null,
                lastName: null,
                companyName: null,
                jobTitle: null,
                address1: null,
                address2: null,
                city: null,
                country: null,
                province: null,
                region: null,
                state: null,
                zipCode: null,
                phoneNumber: null,
                email: null
            },
billingAddress: {
                billingDifferentFromDelivery: false,
                billingAddress1: null,
                billingAddress2: null,
                billingCity: null,
                billingCountry: null,
                billingState: null,
                billingProvince: null,
                billingZipCode: null,
            }

I would like to combine these as either an object with both objects or as an array with both objects. Maybe something similar to this

var addressInformation = {
deliveryAddress: {
                firstName: null,
                lastName: null,
                companyName: null,
                jobTitle: null,
                address1: null,
                address2: null,
                city: null,
                country: null,
                province: null,
                region: null,
                state: null,
                zipCode: null,
                phoneNumber: null,
                email: null
            },
billingAddress: {
                billingDifferentFromDelivery: false,
                billingAddress1: null,
                billingAddress2: null,
                billingCity: null,
                billingCountry: null,
                billingState: null,
                billingProvince: null,
                billingZipCode: null,
            }
}

or

var addressInformation = [{
deliveryAddress: {
                firstName: null,
                lastName: null,
                companyName: null,
                jobTitle: null,
                address1: null,
                address2: null,
                city: null,
                country: null,
                province: null,
                region: null,
                state: null,
                zipCode: null,
                phoneNumber: null,
                email: null
            },
billingAddress: {
                billingDifferentFromDelivery: false,
                billingAddress1: null,
                billingAddress2: null,
                billingCity: null,
                billingCountry: null,
                billingState: null,
                billingProvince: null,
                billingZipCode: null,
            }
}]

is this possible? is there a better way to clean this up when combining objects?

If you want it to be dynamic, you can create a function that accepts objects as parameters. Loop through those objects then insert each one into an empty array or object then return it. — jstarnate
– jstarnate, Commented Apr 9, 2020 at 13:48

Code Maniac · Accepted Answer · 2020-04-09 13:45:20Z

1

You need to assign property name separately

 let addressInformation = {deliveryAddress : ...obj1, billingAddress: ...obj2}

or

 let addressInformation = [{deliveryAddress : ...obj1}, {billingAddress: ...obj2}]

Or if you don't need a new copy then you can do something like this as well

  let addressInformation = {deliveryAddress, billingAddress}

answered Apr 9, 2020 at 13:45

Code Maniac

37.9k5 gold badges44 silver badges65 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

JaySnel Over a year ago

This was perfect and exactly what I was looking for. Thanks!

Confidence Yobo · Accepted Answer · 2020-04-09 13:44:47Z

0

You could do it like this:

let addressInformation = {
    deliveryAddress,
    billingAddress
}

with es6 there is no need for {key:value} when both the key and the value variable have thesame name.

answered Apr 9, 2020 at 13:44

Confidence Yobo

1388 bronze badges

Comments

HollyPony · Accepted Answer · 2020-04-09 13:46:05Z

0

I think you shouldn't spread your objs.

const obj1 = {name: 1}
const obj2 = {name: 2}
const newObj = {obj1, obj2}

// result to `{{name: 1}, {name: 2}}` on newObj

But I'm not sure about the question

/!\ Keep in mind this not a copy object.

answered Apr 9, 2020 at 13:46

HollyPony

84710 silver badges16 bronze badges

Collectives™ on Stack Overflow

How to merge multiple objects as separate objects

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related