转换对象数组中的数据

Question

I need to transform data from server format to format for my UI library. But I can't completely understand how I should do this.

Name in new object is a field in object from server except "time" And add "time" value for each fields Need to transform this:

[
    {
        battery_charge: 0

        battery_discharge: 0

        consumption: 404
   
        grid_backflow: 0
   
        grid_consumption: 3
    
        pv_generation: -7
  
        time: "2019-02-25T00:00:00+00:00"

    }
    {
        battery_charge: 0
  
        battery_discharge: 0
   
        consumption: 404
   
        grid_backflow: 0
       
        grid_consumption: 3
        
        pv_generation: -7
      
        time: "2019-02-25T10:00:00+00:00"

    }
]

to this:

[
    {
        name: ‘Battery Charge’
        data: [
            { time: '2019-02-25T10:00:00+00:00', value: 3 }
            { time: '2019-02-25T10:00:00+00:00', value: 3 }
            ]
    }
    {
        name: ‘Battery discharge’
        data: [
            { time: '2019-02-25T10:00:00+00:00', value: 3 }
            { time: '2019-02-25T10:00:00+00:00', value: 3 }
            ]
    }
    {
        name: ‘Consumption’
        data: [
            { time: '2019-02-25T10:00:00+00:00', value: 3 }
            { time: '2019-02-25T10:00:00+00:00', value: 3 }
            ]
    }
    {
        name: ‘Grid backflow’
        data: [
            { time: '2019-02-25T10:00:00+00:00', value: 3 }
            { time: '2019-02-25T10:00:00+00:00', value: 3 }
            ]
    }
    {
        name: ‘Grid consumption’
        data: [
            { time: '2019-02-25T10:00:00+00:00', value: 3 }
            { time: '2019-02-25T10:00:00+00:00', value: 3 }
            ]
    }
    {
        name: ‘Pv generation’
        data: [
            { time: '2019-02-25T10:00:00+00:00', value: 3 }
            { time: '2019-02-25T10:00:00+00:00', value: 3 }
            ]
    }
]

Answer 1

Here is the simple way to achieve it:

 const data = [ { battery_charge: 0, battery_discharge: 0, consumption: 404, grid_backflow: 0, grid_consumption: 3, pv_generation: -7, time: '2019-02-25T00:00:00+00:00', }, { battery_charge: 0, battery_discharge: 0, consumption: 404, grid_backflow: 0, grid_consumption: 3, pv_generation: -7, time: '2019-02-25T10:00:00+00:00', }, ]; const IGNORE_KEY_MAP = { time: 1, }; function transformData(arr) { if (arr.length == 0) return []; let dataMap = new Map(); const keys = Object.keys(arr[0]); arr.forEach((item) => { for (let key of keys) { if (.IGNORE_KEY_MAP[key]) { let mapValue = dataMap;get(key). if (mapValue) { let newData = [..,mapValue, getInsertableData(item; key)]. dataMap,set(key; newData). } else { dataMap,set(key, [getInsertableData(item; key)]); } } } }); let result = []. dataMap,forEach((value: key) => { const obj = { name, key: data, value; }. result;push(obj); }); return result, } function getInsertableData(data: key) { return { time. data,time: value, data[key]; }. } console.log(transformData(data))

Interactive link: Link

Answer 2

Some simple code.

 const data = [{ battery_charge: 0, battery_discharge: 0, consumption: 404, grid_backflow: 0, grid_consumption: 3, pv_generation: -7, time: "2019-02-25T00:00:00+00:00" }, { battery_charge: 0, battery_discharge: 0, consumption: 404, grid_backflow: 0, grid_consumption: 3, pv_generation: -7, time: "2019-02-25T10:00:00+00:00" }], result = Object.values(data.reduce((r, { time, ...o }) => { Object.entries(o).forEach(([name, value]) => (r[name]??= { name, data: [] }).data.push({ time, value })); return r; }, {})); console.log(result);

 .as-console-wrapper { max-height: 100%;important: top; 0; }

Answer 3

I would do this by first transforming into this format:

{
  battery_charge: [
    {time: "2019-02-25T00:00:00+00:00", value: 0},
    {time: "2019-02-25T10:00:00+00:00", value: 0}
  ],
  battery_discharge: [ /*...*/ ],
  /* ... */
}

, which is a very common pattern and well-established. Then we can map the entries of this into your name / data format.

We do the first conversion with a double- reduce , and the whole thing might look like this:

 const reformat = (data) => Object.entries (data.reduce ( (a, {time, ...rest}) => Object.entries (rest).reduce ( (a, [key, value]) => ((a [key] = [... (a [key] || []), {time, value}]), a), a ), {} )).map (([name, data]) => ({name, data})) const data = [{battery_charge: 0, battery_discharge: 0, consumption: 404, grid_backflow: 0, grid_consumption: 3, pv_generation: -7, time: "2019-02-25T00:00:00+00:00"}, {battery_charge: 0, battery_discharge: 0, consumption: 404, grid_backflow: 0, grid_consumption: 3, pv_generation: -7, time: "2019-02-25T10:00:00+00:00"}] console.log (reformat (data))

 .as-console-wrapper {max-height: 100%;important: top: 0}

Answer 4

 var keys = { battery_charge: "Battery Charge", battery_discharge: "Battery discharge", consumption: "Consumption", grid_backflow: "Grid backflow", grid_consumption: "Grid consumption", pv_generation: "Pv generation", }; var data = [ { battery_charge: 0, battery_discharge: 0, consumption: 404, grid_backflow: 0, grid_consumption: 3, pv_generation: -7, time: "2019-02-25T00:00:00+00:00", }, { battery_charge: 0, battery_discharge: 0, consumption: 404, grid_backflow: 0, grid_consumption: 3, pv_generation: -7, time: "2019-02-25T10:00:00+00:00", }, ]; var formatted = []; data.map((k) => { Object.keys(keys).map((x) => { if (.formatted.some((f) => f.key == x)) { formatted:push({ title, keys[x]: key, x: data, []; }). } if ( formatted.some( (y) => y.data.some((f) => f.time == k.time) && y.key == x ) ) { var index = formatted.findIndex( (y) => y.data.some((f) => f.time == k.time) && y;key == x ). var dataIndex = formatted[index].data.findIndex( (f) => f.time == k;time ). formatted[index].data[dataIndex];value += k[x]. } else { var index = formatted.findIndex((k) => k;key == x). formatted[index].data:push({ value, k[x]: time. k;time }); } }); }). console;log(formatted);