Transform array of objects into object that contains an array of objects (Complex)

Question

I am working with React Native Calendars and attempting to structure my data for the agenda component.

The expected data structure is (an Object)

{ '2012-05-22': [{text: 'item 1 - any js object'}], '2012-05-23': [{text: 'item 2 - any js object'}], '2012-05-24': [], '2012-05-25': [{text: 'item 3 - any js object'},{text: 'any js object'}], }`

When fetching events from my api, the events are returned in the following format (an array of Objects)`

 let eventsFetchedFromApi = [ {startDateTime:"2018-02-01T11:10:43", comments: "First Event"}, {startDateTime:"2018-03-01T11:12:43", comments: "Third Event"}, {startDateTime:"2018-02-01T11:18:43", comments: "Second Event"}, ]`

I have managed to use the following code to turn my arrray of objects into an object (unfortunately it is not very readable, atleast not to me).

let transformedEvents = Object.assign(...eventsFetchedFromApi.map(({ startDateTime, comments }) => ({ [startDateTime.substring(0, 10)]: [{comments: [comments]}] })));

The Structure of 'transformedEvents' is (ALMOST THERE)

{ "2018-02-01":[{"comments": ["First Event"]}], "2018-03-01":[{"comments": ["Third Event"]}] }

As you can see above, only 2 out of 3 events are displayed. If the events have the same date only one will be displayed. My desired output is

{ "2018-02-01":[{"comments": "First Event"}, {"comments": "Second Event"}], "2018-03-01":[{"comments": "Third Event"}] }

**I need events that have the same date to be grouped together. Can anyone assist me with getting my desired data structure? I am not sure how to solve this one. Thanks **

Your desired output has the second event in "2018-02-01" but in eventsFetchedFromApi the second event has startDateTime of "2018-03-01T...? — CertainPerformance
– CertainPerformance, Commented Jun 2, 2018 at 6:47

CertainPerformance · Accepted Answer · 2018-06-02 06:43:51Z

You can use reduce to group an array of objects into a single object indexed by the date string. You can't use map if the input and output items aren't one-to-one, as in your case.

const eventsFetchedFromApi=[{startDateTime:"2018-02-01T11:10:43",comments:"First Event"},{startDateTime:"2018-03-01T11:12:43",comments:"Second Event"},{startDateTime:"2018-02-01T11:18:43",comments:"Third Event"}]; const output = eventsFetchedFromApi.reduce((a, { startDateTime, comments }) => { const prop = startDateTime.slice(0, 10); if (!a[prop]) a[prop] = []; a[prop].push({ comments }); return a; }, {}); console.log(output);

amrender singh · Accepted Answer · 2018-06-02 06:49:04Z

Try the following:

var arr1 = [ {startDateTime:"2018-02-01T11:10:43", comments: "First Event"}, {startDateTime:"2018-03-01T11:12:43", comments: "Second Event"}, {startDateTime:"2018-02-01T11:18:43", comments: "Third Event"}, ]; var result = {}; arr1.forEach(function(obj){ var date = obj.startDateTime.slice(0,10); if(!result[date]) result[date] = []; result[date].push({"comments" : obj.comments}); }); console.log(result);

Nishant Dixit · Accepted Answer · 2018-06-02 06:51:42Z

var resultObject = {}; let eventsFetchedFromApi = [{ startDateTime: "2018-02-01T11:10:43", comments: "First Event" }, { startDateTime: "2018-03-01T11:12:43", comments: "Second Event" }, { startDateTime: "2018-02-01T11:18:43", comments: "Third Event" }, ] eventsFetchedFromApi.forEach((val) => { let date = val.startDateTime.split("T")[0]; resultObject[date] = resultObject[date] || {}; resultObject[date].startDateTime = val.startDateTime; resultObject[date].comments = resultObject[date].comments || [] resultObject[date].comments.push({ comments: val.comments }); }); const finalResultArray = Object.values(resultObject); console.log(finalResultArray);

KooiInc · Accepted Answer · 2018-06-02 07:39:53Z

Would this reducer do what you want?

const dt2Date = dateStr => dateStr.split("T")[0]; const createOrPush = (obj, key, value) => obj[key] ? obj[key].push(value) && obj[key] : [].concat(value); const reducer = (redo, {startDateTime, comments}) => Object.assign( redo, { [dt2Date(startDateTime)]: createOrPush(redo, dt2Date(startDateTime), {comments: comments}) }); const array2Convert = [ {startDateTime:"2018-02-01T11:10:43", comments: "First Event"}, {startDateTime:"2018-03-01T11:12:43", comments: "Third Event"}, {startDateTime:"2018-02-01T11:18:43", comments: "Second Event"}, ]; console.log(array2Convert.reduce( reducer, {} ));

Collectives™ on Stack Overflow

Transform array of objects into object that contains an array of objects (Complex)

4 Answers 4

Comments

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Related