Combining Javascript objects

Question

I am creating a food menu app using reactjs at the frontend and django backend. I unfortunately got stuck here mostly because of my little knowledge of Javascript.Here is my problem. I have this array of objects

const objectOfArray = [
    {
    "id":"1a2f2c7a-0e06-4784-a1fb-68e083a72aa5","cat_id":"812347b3-615f-4f4a-b201-64737ddf4718","event_id":"ead9898c-9606-49e0-aa2b-c7f34331a856"
    },
    {
    "id":"7bee12ac-7253-4e5a-a86f-2ea0a3765541","cat_id":"6968da9d-4475-4431-801d-e3eeda02145a","event_id":"ead9898c-9606-49e0-aa2b-c7f34331a856"
    },
    {
    "id":"42763c0d-84f1-4f07-97c8-aa914bfb92fa","cat_id":"812347b3-615f-4f4a-b201-64737ddf4718","event_id":"ead9898c-9606-49e0-aa2b-c7f34331a856"
    }
]

then another object const myObject = {"seat":"4","table":"10"}

I want each of the object in objectOfArray to have myObject so that the output now looks like this

[
    {
    "id":"1a2f2c7a-0e06-4784-a1fb-68e083a72aa5","cat_id":"812347b3-615f-4f4a-b201-64737ddf4718","event_id":"ead9898c-9606-49e0-aa2b-c7f34331a856","seat":"4","table":"10"
    },
    {
    "id":"7bee12ac-7253-4e5a-a86f-2ea0a3765541","cat_id":"6968da9d-4475-4431-801d-e3eeda02145a","event_id":"ead9898c-9606-49e0-aa2b-c7f34331a856","seat":"4","table":"10"
    },
    {
    "id":"42763c0d-84f1-4f07-97c8-aa914bfb92fa","cat_id":"812347b3-615f-4f4a-b201-64737ddf4718","event_id":"ead9898c-9606-49e0-aa2b-c7f34331a856","seat":"4","table":"10"
    }
]

Please look at your post after submitting, so you can tell whether you have any markup errors. Which you do. And you should fix — Mike 'Pomax' Kamermans
– Mike 'Pomax' Kamermans, Commented Oct 9, 2021 at 0:50

ray · Accepted Answer · 2021-10-09 01:04:11Z

1

As Lawrence suggested in a comment you can accomplish this using map with spread syntax:

const objectOfArray = [
    {
    "id":"1a2f2c7a-0e06-4784-a1fb-68e083a72aa5","cat_id":"812347b3-615f-4f4a-b201-64737ddf4718","event_id":"ead9898c-9606-49e0-aa2b-c7f34331a856"
    },
    {
    "id":"7bee12ac-7253-4e5a-a86f-2ea0a3765541","cat_id":"6968da9d-4475-4431-801d-e3eeda02145a","event_id":"ead9898c-9606-49e0-aa2b-c7f34331a856"
    },
    {
    "id":"42763c0d-84f1-4f07-97c8-aa914bfb92fa","cat_id":"812347b3-615f-4f4a-b201-64737ddf4718","event_id":"ead9898c-9606-49e0-aa2b-c7f34331a856"
    }
]

const myObject = {"seat":"4","table":"10"};

const result = objectOfArray.map(item => ({...item, ...myObject}));

console.log(result);

answered Oct 9, 2021 at 1:04

ray

27.3k5 gold badges31 silver badges30 bronze badges

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

Comments

Tangentially Perpendicular · Accepted Answer · 2021-10-09 01:09:14Z

You can assign the properties in myObject to some other object with Object.assign().

You also need a way to iterate over the original array: .map will do that.

Combining these two, you get

const objectOfArray = [
        {
            "id":"1a2f2c7a-0e06-4784-a1fb-68e083a72aa5","cat_id":"812347b3-615f-4f4a-b201-64737ddf4718","event_id":"ead9898c-9606-49e0-aa2b-c7f34331a856"
        },
        {
            "id":"7bee12ac-7253-4e5a-a86f-2ea0a3765541","cat_id":"6968da9d-4475-4431-801d-e3eeda02145a","event_id":"ead9898c-9606-49e0-aa2b-c7f34331a856"
        },
        {
            "id":"42763c0d-84f1-4f07-97c8-aa914bfb92fa","cat_id":"812347b3-615f-4f4a-b201-64737ddf4718","event_id":"ead9898c-9606-49e0-aa2b-c7f34331a856"
        }
    ];

const myObject = {"seat":"4","table":"10"}

newArray = objectOfArray.map(e=>Object.assign(e,myObject));

console.log(newArray);

Collectives™ on Stack Overflow

Combining Javascript objects

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related