Object Array with dates, tallied together for each month Code Answer

Hello Developer, Hope you guys are doing great. Today at Tutorial Guruji Official website, we are sharing the answer of Object Array with dates, tallied together for each month without wasting too much if your time.

The question is published on by Tutorial Guruji team.

Overview

  1. I need to make a chart in my react project.
  2. Using data from a json (Object Array). Example json:
[
{recruiter_id: 1, datetime_created: "1/01/2021", name: "Aaron"},
{recruiter_id: 2, datetime_created: "9/01/2021", name: "Bob"},
{recruiter_id: 1, datetime_created: "9/01/2021", name: "Aaron"},
{recruiter_id: 3, datetime_created: "20/01/2021", name: "Jane"}
]
  1. Result object array structure required:
[
{name: name,
 recruiter_id: recruiter_id,
 week_qty: [0,2,1,0,2,0,0,0,0,0,0,0,0,1,0,0,0,...] },
...]

// week_qty will be an array of 52 to represent each week of the year. It will be a 0 if there was no dates for that week.

Goal

This is what the new object array should look like, if we used the example json.

[
{name: "Aaron", recruiter_id:1, week_qty: [1,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,...]},
{name: "Bob", recruiter_id:2, week_qty: [0,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,...]},
{name: "Jane", recruiter_id:3, week_qty: [0,0,0,1,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,...]}
]

What I have

I dont have any working code yet. I am currently working on object[0] to attempt to put the dates into the 52 array. And then after that I will then turn it into a loop to work on each object. Once I have it semi working, I will post it for example.

— Edit —

   var array = result
        var flags = [], output = [], l = array.length, i;
        for (i = 0; i < l; i++) {
            if (flags[array[i].recruiter_id]) continue;
            flags[array[i].recruiter_id] = true;
            var temp = {}
            temp.Recruiter_id = array[i].recruiter_id
            temp.Name = array[i].name
            temp.QTY = []
            output.push(temp);
        }
        console.log("output : ", output)

This produces the new object array structure with the id and name filled out.

[
{name: name,
 recruiter_id: recruiter_id,
 week_qty: [] },
...]

It only has 1 object for each id

Now I need to work on getting the week numbers for the dates and put them into each of those objects.


Question

Any code suggestions on how to get this result?


Side Note

If your curious to know how I then plan on using the new object array to use with my chart.

  1. I will let the user select the week. Lets say week 1.
  2. I will then map through the object array and get the week_qty for index 1 and the name value of the object.
  3. I will store that week_qty and the name in a new new object array.
  4. That new new object array will then look like this
[{name: "Aaron",QTY: 2},{name: "Bob",QTY: 1,]
  1. That will then be passed as the x and y value to the chart.

Answer

You can use reduce and increase the week counter after parsing each date and getting the week (using moment.js for that part here)

But you can see Get week of year in JavaScript like in PHP for more details on how to calculate it yourself

const data = [
  {recruiter_id: 1, datetime_created: "1/01/2021", name: "Aaron"},
  {recruiter_id: 2, datetime_created: "9/01/2021", name: "Bob"},
  {recruiter_id: 1, datetime_created: "9/01/2021", name: "Aaron"},
  {recruiter_id: 3, datetime_created: "20/01/2021", name: "Jane"}
 ];

const weekly = data.reduce((acc, item, index, array) => {
  const {
    recruiter_id,
    datetime_created,
    name
  } = item;
  let existing = acc.find(({
    recruiter_id: id
  }) => id === recruiter_id);
  
  if (!existing) {
    existing = {recruiter_id, name, week_qty:Array(52).fill(0)};
    acc.push(existing);
  }
  
  const week = moment(datetime_created,'D/M/YYYY').week()-1;
  existing.week_qty[week]++;
  return acc;
}, []);

console.log(JSON.stringify(weekly))
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js" integrity="sha512-qTXRIMyZIFb8iQcfjXWCO8+M5Tbc38Qi5WzdPOYZHIlZpzBHG3L3by84BBBOiRGiEb7KKtAOAs5qYdUiZiQNNQ==" crossorigin="anonymous"></script>
We are here to answer your question about Object Array with dates, tallied together for each month - If you find the proper solution, please don't forgot to share this with your team members.

Related Posts

Tutorial Guruji