Skip to content
Advertisement

pivoting array of object data javascript

so i have an array of object like this:

const data =[{
    "username": "MT220047",
    "title": "Test",
    "position": "Management Trainee",
    "department": "Logistic",
    "2022-11-15": 1,
    "2022-11-16": 2
  },
  {
    "username": "MT220047",
    "title": "UntitledForm1",
    "position": "Management Trainee",
    "department": "Logistic",
    "2022-11-16": 1
  },
  {
    "username": "17000691",
    "title": "Test",
    "position": "Foreman",
    "department": "Production",
    "2022-11-16": 1,
    
  }
]

const date =["2022-11-11","2022-11-12","2022-11-13","2022-11-14","2022-11-15","2022-11-16"]

const accumulator = {}
const final =[]
const res = date.map((tanggal)=>{ return data.reduce((a,e)=>(a[e.tanggal]={...(a[e.tanggal] || {}), ...e}, a),{});})
       
console.log(res)

it try to get the summary or pivot value of the dates, but i get this result instead of what i expected:

[ { undefined:
     { username: '17000691',
       title: 'Test',
       position: 'Foreman',
       department: 'Production',
       '2022-11-15': 1,
       '2022-11-16': 1 } },
  { undefined:
     { username: '17000691',
       title: 'Test',
       position: 'Foreman',
       department: 'Production',
       '2022-11-15': 1,
       '2022-11-16': 1 } },
  { undefined:
     { username: '17000691',
       title: 'Test',
       position: 'Foreman',
       department: 'Production',
       '2022-11-15': 1,
       '2022-11-16': 1 } },
 ....]

my expected result should be like this: i try to get the summary total of the dates base on the date array…

 summary_date:[ {"2022-11-15": 1},{"2022-11-16": 4}]

or is it possible to get this result:

data = [{"date":"2022-11-16","total":4},{"date":"2022-11-15","total":1}]

any help on this, or can someone tellme where did i do wrong here?

Advertisement

Answer

A combination of an outer .reduce() over the data array with an inner .foreach() over all the dates should do it:

const data =[{
"username": "MT220047",
"title": "Test",
"position": "Management Trainee",
"department": "Logistic",
"2022-11-15": 1,
"2022-11-16": 2
  },
  {
"username": "MT220047",
"title": "UntitledForm1",
"position": "Management Trainee",
"department": "Logistic",
"2022-11-16": 1
  },
  {
"username": "17000691",
"title": "Test",
"position": "Foreman",
"department": "Production",
"2022-11-16": 1,

  }
]

const dates =["2022-11-11","2022-11-12","2022-11-13","2022-11-14","2022-11-15","2022-11-16"]

const res=data.reduce((ac,c)=>{
 const a=(ac[c.title]??={});
 dates.forEach(d=>{if(c[d]) a[d]=(a[d]??0)+c[d]});
 return ac;
}, {});

console.log(res);

// convert res into an array of objects resa:
const resa=Object.entries(res).reduce((a,[k,v])=>
 [...a,{title:k},...Object.entries(v).map(([k,v])=>({[k]:v}))], []);
console.log(resa);

The .forEach() callback function

d=>{if(c[d]) a[d]=(a[d]??0)+c[d]}

does the following:

  1. For each date d it checks whether the current data element c has a property d
  2. if so, the element a[d] of the accumulator object a is checked for existence and, if necessary, initialised to 0
  3. the value of c[d] is then added to a[d]

Yet another update to the updated question:

const data =[{
"username": "MT220047",
"title": "Test",
"position": "Management Trainee",
"department": "Logistic",
"2022-11-15": 1,
"2022-11-16": 2
  },
  {
"username": "MT220047",
"title": "UntitledForm1",
"position": "Management Trainee",
"department": "Logistic",
"2022-11-16": 1
  },
  {
"username": "17000691",
"title": "Test",
"position": "Foreman",
"department": "Production",
"2022-11-16": 1,

  }
]

const dates =["2022-11-11","2022-11-12","2022-11-13","2022-11-14","2022-11-15","2022-11-16"]

const res=Object.entries(data.reduce((a,c)=>{
 dates.forEach(d=>{if(c[d]) a[d]=(a[d]??0)+c[d]});
 return a;
}, {})).map(([date,total])=>({date,total}));

console.log(res);

Changing your question several times makes it unnecessarily hard for anyone to answer it. Please phrase any question you post here carefully and consider that others are investing their time and effort into preparing (and updating!) answers for you.

Advertisement