Merge array objects of different values in a new object

Question

I have 3 array objects-

dates = [{date: '12/04/2023'}, {date: '13/04/2023'}]
days = [{day: 'Monday'}, {day: 'Tuesday'}]
time = [{time: '09-10'}, {time: '10-11'}]

the final array should be like:

final = [
{
 date: '12/04/2023',
 day: 'Monday',
 time: '09-10'
},
{
 date: '13/04/2023',
 day: 'Tuesday',
 time: '10-11'
 }
]

I tried merging/concat the arrays and other solutions that I could find but couldn't find anything closer to my desired result.

I know there have been multiple questions on merging array objects but I haven't been able to find any solution that fits my requirement.

Any help would highly appreciated.Thanks.

why is 10-11 a day on 3rd array. also can use map and spread and access other arrays using index — cmgchess
– cmgchess, Commented Apr 12, 2023 at 6:30
Does this answer your question? Create an object from an array of keys and an array of values — jsejcksn
– jsejcksn, Commented Apr 26, 2023 at 20:40

cmgchess · Accepted Answer · 2023-04-12 06:47:37Z

2

you can use map and the index to access other arrays.

const dates = [{date: '12/04/2023'}, {date: '13/04/2023'}]
const days = [{day: 'Monday'}, {day: 'Tuesday'}]
const time = [{time: '09-10'}, {time: '10-11'}]

const res = dates.map(({date},i) => ({date, day: days[i].day, time: time[i].time}))

console.log(res)

edited Apr 12, 2023 at 6:47

answered Apr 12, 2023 at 6:35

cmgchess

10.3k42 gold badges55 silver badges70 bronze badges

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

3 Comments

alittlecurryhot Over a year ago

This works perfectly, would you able to explain the logic briefly. Thanks

cmgchess Over a year ago

@ankitjt which part you dont understand. map is used to transform an array. so here I'm transforming the dates array into an array of objects containing the other 2 fields as well. to get the other 2 fields i use the index which is available in map

cmgchess Over a year ago

@ankitjt hope this was clear. let me know if any other questions

Muriithi Derrick · Accepted Answer · 2023-04-12 06:50:05Z

0

Using a for loop.

const final = [];

for (let date = 0; date < dates.length; date++) {
  for (let day = 0; day < days.length; day++) {
    for (let t = 0; t < time.length; t++) {
      const tmp = {
        date: dates[date].date,
        day: days[day].day,
        time: time[t].time
      };
      result.push(tmp);
    }
  }
}

console.log(final);

answered Apr 12, 2023 at 6:50

Muriithi Derrick

3522 silver badges8 bronze badges

Comments

Chan · Accepted Answer · 2023-04-12 07:07:03Z

0

You can use for loop for simple reading and better performance

dates = [{date: '12/04/2023'}, {date: '13/04/2023'}]
days = [{day: 'Monday'}, {day: 'Tuesday'}]
time = [{time: '09-10'}, {time: '10-11'}]

combined = []

for(i = 0; i < dates.length; i++){
  combined.push({
  date: dates[i].date, 
  day: days[i].day, 
  time: time[i].time
  })
}

console.log(combined)

Also... there is this post that might help you with repeated date and you wanted to make it unique. Create New array from another array

edited Apr 12, 2023 at 7:07

answered Apr 12, 2023 at 6:43

Chan

718 bronze badges

Comments

Hetal N · Accepted Answer · 2023-04-12 08:03:43Z

0

Try this changes,

dates = [{date: '12/04/2023'}, {date: '13/04/2023'}]
days = [{day: 'Monday'}, {day: 'Tuesday'}]
time = [{time: '09-10'}, {time: '10-11'}]
    
const result = dates.map((d,index) => {
    d.day = days[index].day;
    d.time = time[index].time;
})

console.log(result)

edited Apr 12, 2023 at 8:03

answered Apr 12, 2023 at 6:31

Hetal N

3341 silver badge10 bronze badges

3 Comments

T.J. Crowder Over a year ago

Please don't misuse map when you're not using the array it creates. If you just want a loop, just use a loop (or forEach). More in my post here. (But instead of doing [...dates] and then map, you could correctly using map on dates...) It's also probably worth making sure the OP understands this modifies the objects in the dates array, rather than creating new objects.

Hetal N Over a year ago

Yes, I checked your post and found much useful, Thank you for your suggestion :) I have updated my answer

T.J. Crowder Over a year ago

You're still using map without using its return value. See cmgchess' answer for how you'd properly use map.

zb22 · Accepted Answer · 2023-04-12 09:37:29Z

0

I think @cmgchess has the best answer,
Just wanted to share an interesting solution for this by using Array.prototype.reduce() and the remainder of the array's index and the length of the array:

const dates = [{date: '12/04/2023'}, {date: '13/04/2023'}];
const days = [{day: 'Monday'}, {day: 'Tuesday'}];
const time = [{time: '09-10'}, {time: '10-11'}];

const size = dates.length;
const res = [...dates, ...days, ...time].flat().reduce((acc, curr, index) => {
  acc[index % size] = {
    ...acc[index % size],
    ...curr
  }

  return acc;
}, []);

console.log(res);

edited Apr 12, 2023 at 9:37

answered Apr 12, 2023 at 9:32

zb22

3,2413 gold badges22 silver badges38 bronze badges

Collectives™ on Stack Overflow

Merge array objects of different values in a new object

5 Answers 5

3 Comments

Comments

Comments

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

3 Comments

Comments

Comments

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related