javascript将数组合并为一个对象

时间:2018-01-14 07:07:16

标签: javascript arrays typescript

我正在尝试将多个数组合并到一个对象中,然后我可以迭代以在chart.js数据集中使用。我有一组看起来像这样的数据:

export const data = [
    {
        'name': 'Flow',
        'values': {
            'sent': 410,
            'responded': 253,
            'secured': 65
        }
    }
] 

(我将此限制为只有一个,但数据集要大得多)

然后我根据这些数据构建了几个阵列:

this.labels = data.map(item => item.name);
this.colors = ['#439ff4', '#5ec3d5', '#a068e5'];
this.responded = data.map(item => item.values.responded);
this.sent = data.map(item => item.values.sent);
this.secured = data.map(item => item.values.secured);

我需要做的是:

  1. 获取另一个数组的密钥名称(响应,发送,保护)
  2. 将键,颜色,响应,发送和安全的数组合并到一个名为数据集的对象中。

    this.datasets = [ /* not sure what to do here! */];

  3. 最终我在图表js中的图表正在寻找类似的东西(我现在有部分硬编码值:

    datasets: [
        {
            label: 'Sent',
            data: this.sent,
            backgroundColor: '#439ff4'
        },
        {
            label: 'Responded',
            data: this.responded,
            backgroundColor: '#5ec3d5'
        },
        {
            label: 'Secured',
            data: this.secured,
            backgroundColor: '#a068e5'
        }
    ],
    

    我最终想表达为

    datasets: this.datasets,

    我希望我能够很好地解释我要做的事情。

1 个答案:

答案 0 :(得分:1)

假设data.values中的键名保持小写,否则与datasets[*].label相同,您可以执行以下操作。



// the custom type is just for making it more manageable, omit it if you want
type DatasetItem = { label: string, data: number[], backgroundColor: string };

let datasets: Array<Partial<DatasetItem>> = [
    {
        label: 'Sent',
        backgroundColor: '#439ff4'
    },
    {
        label: 'Responded',
        backgroundColor: '#5ec3d5'
    },
    {
        label: 'Secured',
        backgroundColor: '#a068e5'
    }
];    

const data = [
    {
        'name': 'Flow1',
        'values': {
            'sent': 410,
            'responded': 253,
            'secured': 65
        }
    },
    {
        'name': 'Flow2',
        'values': {
            'sent': 411,
            'responded': 254,
            'secured': 66
        }
    }
];

datasets.forEach((item) => item.data = data.map((d) => d.values[item.label.toLowerCase()]));    
console.log(datasets);
&#13;
&#13;
&#13;