Restructuring Javascript Array of Objects

Question

I have a set of data which I'm trying to convert it into a different structure. I have almost reached the requirement but I'm stuck at the last part. Here's the code and what I have tried so far.

let array1 = [
  {
    aggr_type: "mean",
    date: ['19 Apr', '20 Apr'],
    mean: [13.87, 8.42],
    name: "TEMPERATURE",
    sum: [0.1, 0.2]
  },
  {
    aggr_type: "sum",
    date: ['19 Apr', '20 Apr'],
    mean: [45.42, 55.22],
    name: "HUMIDITY",
    sum: [0.3, 0.5]
  }
];
let names = [];
array1.forEach(el => {
  names.push(el.name);
});
const myObj = names.reduce((a, key) => Object.assign(a, { [key]: null, date: null }), {});
// console.log(myObj);
// console.log(array1);
let arrays = []

for(i=0; i < array1[0].date.length; i++) {
  array1.forEach(el => {
    myObj.date = el.date[i];
    myObj[el.name] = el.[el.aggr_type][i];
    arrays.push(myObj);
  });
}

console.log(arrays);

If this snippet isn't working use this codepen

I'm supposed to have the output like this.

    [
{
  'TEMPERATURE': '13.87',
 'date': '19 Apr',
 'HUMIDITY': '0.3'
},
{
  'TEMPERATURE': '8.42', 
  'date': '20 Apr', 
  'HUMIDITY': '0.5'
}
];

But it only returns the last index. Is there any way to get the output like I've mentioned above.

NOTE: The values should be added the final output based on the aggr_type

What is up with aggr_type?

Adam Orłowski
– Adam Orłowski

2022-04-20 16:33:08 +00:00
Commented Apr 20, 2022 at 16:33 — Adam Orłowski
– Adam Orłowski, Commented Apr 20, 2022 at 16:33
@AdamOrłowski sorry I have updated my question.

Viira
– Viira

2022-04-20 16:35:05 +00:00
Commented Apr 20, 2022 at 16:35 — Viira
– Viira, Commented Apr 20, 2022 at 16:35
Your question doesn't make sense to me. It is confusing.

Adam Orłowski
– Adam Orłowski

2022-04-20 16:42:38 +00:00
Commented Apr 20, 2022 at 16:42 — Adam Orłowski
– Adam Orłowski, Commented Apr 20, 2022 at 16:42
If you go through my code you can see it.

Viira
– Viira

2022-04-20 16:45:01 +00:00
Commented Apr 20, 2022 at 16:45 — Viira
– Viira, Commented Apr 20, 2022 at 16:45

jsN00b · Accepted Answer · 2022-04-20 16:54:43Z

1

The below may be one possible solution to achieve the desired objective.

Code Snipppet

// method to obtain the desired objective
const groupByDate = arr => (
  Object.values(        // extract only the "values" from result of "reduce"
    arr.reduce(         // use "reduce" to iterate over the array
      (acc, {name, date, mean}) => {
        date.forEach(   // for each "date" in the "date-array"
          (d, i) => {   // populate / update the "acc" (accumulator)
            acc[d] = {
              ...(acc[d] || {}),
              [name]: mean[i],    // this line populates either temperator or humidity
              date: d,
            }
          }
        )
        return acc;       // always return the "acc" 
      },
      {}                  // initially the "acc" is set as an empty object
    )
  )
);

let array1 = [
  {
    aggr_type: "mean",
    date: ['19 Apr', '20 Apr'],
    mean: [13.87, 8.42],
    name: "TEMPERATURE",
    sum: [0.1, 0.2]
  },
  {
    aggr_type: "sum",
    date: ['19 Apr', '20 Apr'],
    mean: [45.42, 55.22],
    name: "HUMIDITY",
    sum: [0.3, 0.5]
  }
];

console.log(groupByDate(array1));

Explanation Inline comments in the above snippet explain the significant aspects.

EDIT

Used the input array array1 that was updated on the question. The answer from the snippet matches with the expected array on the question:

[
{
  'TEMPERATURE': '13.87',
 'date': '19 Apr',
 'HUMIDITY': '45.42'
},
{
  'TEMPERATURE': '8.42', 
  'date': '20 Apr', 
  'HUMIDITY': '55.22'
}
];

EDIT 2

// method to obtain the desired objective
const groupByDate = arr => (
  Object.values(        // extract only the "values" from result of "reduce"
    arr.reduce(         // use "reduce" to iterate over the array
      (acc, ob) => {
        const {name, date, aggr_type} = ob;
        const tgt = ob[aggr_type];    // decide whether to use "mean" or "sum"
        date.forEach(   // for each "date" in the "date-array"
          (d, i) => {   // populate / update the "acc" (accumulator)
            acc[d] = {
              ...(acc[d] || {}),
              [name]: tgt[i],    // this line populates either temperature or humidity
              date: d,
            }
          }
        )
        return acc;       // always return the "acc" 
      },
      {}                  // initially the "acc" is set as an empty object
    )
  )
);

let array1 = [
  {
    aggr_type: "mean",
    date: ['19 Apr', '20 Apr'],
    mean: [13.87, 8.42],
    name: "TEMPERATURE",
    sum: [0.1, 0.2]
  },
  {
    aggr_type: "sum",
    date: ['19 Apr', '20 Apr'],
    mean: [45.42, 55.22],
    name: "HUMIDITY",
    sum: [0.3, 0.5]
  }
];

console.log(groupByDate(array1));

edited Apr 20, 2022 at 16:54

answered Apr 20, 2022 at 16:26

jsN00b

3,7032 gold badges10 silver badges22 bronze badges

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

4 Comments

Viira Over a year ago

I have updated my question, because the key mean could be random.

Viira Over a year ago

can you add the numbers based on aggr_func of the value instead of putting just mean

jsN00b Over a year ago

There is nothing named aggr_func in the question - I assume aggr_type. EDIT 2 achieves the new output mentioned in the question. Thank you ! (Nandri vanakkam !)

Viira Over a year ago

Nandrigal thala :)

Stephen P · Accepted Answer · 2022-04-20 17:01:03Z

The problem is that you have created a single myObj

const myObj = names.reduce((a, key) =>
                  Object.assign(a, { [key]: null, date: null }), {});

and you assign to it and then push it within your loop

for (i=0; i < array1[0].date.length; i++) {
    array1.forEach(el => {
                       myObj.date = el.date[i];  // <-- modifies the ONE 'myObj'
                       myObj[el.name] = el.[el.aggr_type][i];
                       arrays.push(myObj); // <-- pushes the ONE myObj (again)
    });
}

You end up with 4 references to myObj in your arrays — each time you assign to it, for example myObj.date = el.date[i], you are modifying that one and only myObj ... That is, after the first time you do arrays.push(myObj) you have arrays[0] containing myObj, then the next time through the loop when you assign values to myObj again that is changing the values that are in arrays[0] since that is myObj.

You can treat myObj as a prototype — you need separate instances of objects that look like myObj so each one pushed into arrays is a unique object.

Modifying your original code as little as possible, here is one way that could be done:

let array1 = [
    {
        aggr_type: "mean",
        date: ['19 Apr', '20 Apr'],
        mean: [13.87, 8.42],
        name: "TEMPERATURE",
    },
    {
        aggr_type: "mean1",
        date: ['19 Apr', '20 Apr'],
        mean: [45.42, 55.22],
        name: "HUMIDITY",
    }
];
let names = [];
array1.forEach(el => {
    names.push(el.name);
});
// Changed the name here so I wouldn't have to change it in the loop
const protoMyObj = names.reduce((a, key) =>
    Object.assign(a, { [key]: null, date: null }), {});
// console.log(myObj);
// console.log(array1);
let arrays = []

for (i=0; i < array1[0].date.length; i++) {
    array1.forEach(el => {
        // Make a new copy of the "prototype" `protoMyObj`
        let myObj = Object.assign({}, protoMyObj);
        myObj.date = el.date[i];
        myObj[el.name] = el.mean[i];
        arrays.push(myObj);
    });
}

console.log(arrays);

Collectives™ on Stack Overflow

Restructuring Javascript Array of Objects

2 Answers 2

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related