以编程方式更改为对象中的另一个键

时间:2019-06-04 09:59:13

标签: javascript node.js reactjs object chart.js

我正在尝试为Chart.js准备数据,因此我必须以编程方式更改对象键。我发现此硬编码版本有效。 `

fetch('http://...)
        .then (results =>{
            return results.json();
        }).then(data => {
            console.log(data);


        var utplockadData = {
            datasets: [
            ]
        };


        for(var i=1; i<Object.keys(data[0][0]).length; i++){
            utplockadData.datasets[i] = {label: Object.keys(data[0][0])[i], data: [], pointRadius: 1 ,fill: false, borderColor: "black"};
        }
        console.log(utplockadData);



        for (var i=1; i<data[0].length; i++){
            utplockadData.datasets[1].data[i] = {x: data[0][i].timestamp, y: data[0][i].airTemperature};
            utplockadData.datasets[2].data[i] = {x: data[0][i].timestamp, y: data[0][i].heaterTemperature};
        }
        console.log(utplockadData);
})

预期结果:

datasets: Array(3)
1:
borderColor: "black"
data: Array(1441)
[1 … 100]
1: {x: "2019-05-01 00:01:00", y: 4.2}
2: {x: "2019-05-01 00:02:09", y: 4.1}
3: {x: "2019-05-01 00:03:00", y: 4.1}
4: {x: "2019-05-01 00:04:09", y: 4.1}...

但是,如果我将带有地址的数组添加到键并更改循环,就像这样:

var enArray = [data[0][i].airTemperature, data[0][i].heaterTemperature];

for (var i=1; i<data[0].length; i++){
            utplockadData.datasets[1].data[i] = {x: data[0][i].timestamp, y: enArray[0]};
            utplockadData.datasets[2].data[i] = {x: data[0][i].timestamp, y: enArray[1]};

}

结果是这样,所有键都具有相同的值:

未预期的结果:

datasets: Array(3)
1:
borderColor: "black"
data: Array(1441)
[1 … 100]
1: {x: "2019-05-01 00:01:00", y: 4.1}
2: {x: "2019-05-01 00:02:09", y: 4.1}
3: {x: "2019-05-01 00:03:00", y: 4.1}
4: {x: "2019-05-01 00:04:09", y: 4.1}
5: {x: "2019-05-01 00:05:00", y: 4.1}
6: {x: "2019-05-01 00:06:00", y: 4.1}
7: {x: "2019-05-01 00:07:00", y: 4.1}...

我不知道这是怎么回事。如何在不将其全部添加到for循环的情况下访问airTemperature和heatingTemperature的值?

更新: 从后端添加示例数据。

[

    [
        {timestamp: '2019-05-01 01:38:00',
            airTemperature: 3.5,
            heaterTemperature: 2.6 },

        {timestamp: '2019-05-01 01:39:00',
            airTemperature: 3.5,
            heaterTemperature: 2.6 },
    ],

        "text"

]

1 个答案:

答案 0 :(得分:1)

看起来您的enArray不是您想的那样...

var enArray = [data[0][i].airTemperature, data[0][i].heaterTemperature];

由于i是单个值,因此enArray将是其中包含两个值的单个平面数组,即[4.1, 4.2]。这些在您的新循环中反复使用。

如果您仍然遇到问题,建议将其剥离为可以创建为Codepen或类似形式的最简单示例。仅此一项可能会引导您找到解决方案,但如果没有解决方案,那么其他人更有可能提供帮助。