在Chart.js栏中合并具有不同键的两个对象

Question

我有两个json：

first: {
"a": 1,
"b": 9,
"c": 12,
"d": 5
}  

和

second: {
"a": 7,
"e": 8,
"b": 11,
"f": 7
}  

并且我想创建包括两个json（带有两个数据集）的chartjs栏。 标签应为“ a”，“ b”，“ c”，“ d”，“ e”，“ f”，“第一个”数据集的数据将为：1、9、12、5、0、0。 “第二”数据集的数据将是：7、11、0、0、8、7。

我现在的代码：

var barChartData = {
    labels: Object.keys(first),
    datasets:[
        {
            label:'first',
            data: Object.values(first)
        },
        {
        label: 'second',
        data: Object.values(second)
        }]
};

window.myBar = new Chart(document.getElementById("barChart").getContext("2d"),
{
    type:'bar',
    data: barChartData
});

问题是我希望标签既来自“ first”和“ second” jsons的键，又不仅来自“ first”，而且值也适合键。

有没有简单的方法可以做到这一点？

Answer 1

看起来您希望两个对象都具有相同的键，但是当未定义键时其值为零。 有几种方法可以做到这一点。 一种选择是列出两个对象的组合键，然后遍历它们，如果该键不存在，则将对象的值设置为0：

 let first = {"a": 1,"b": 9,"c": 12,"d": 5 } let second = {"a": 7,"e": 8,"b": 11,"f": 7} Object.keys(Object.assign({}, first, second)) // get combined keys .forEach(k => { if (!first.hasOwnProperty(k)) first[k] = 0; // set 0 if key is not in object if (!second.hasOwnProperty(k)) second[k] = 0; }) console.log(first, second)