将 JSON 对象中的列提取到数组中答案

【问题标题】：Extract columns from a JSON-Object into an Array将 JSON 对象中的列提取到数组中
【发布时间】：2016-12-13 17:33:19
【问题描述】：

此时我正在为一个自主植物箱编写一个基于网络的用户界面（没有犯罪行为:)）

我们有一个基于 SPS 的控制器，它定期将温度和湿度数据记录到 SQL 数据库中。

我编写了一个小的 PHP 脚本，它检索一些最近的行并将其作为数组返回给我。到目前为止一切顺利，我还没有能够使用$.getJSON() 将这些数据输入到我的 HTML 页面中。我知道这已经过时了，我最好使用 ajax 函数，但目前这不是问题。

我的 PHP 脚本返回一个 JSON 格式的数组：

[
    {"id":"321","datum":"12.12.2016","time":"19:12","temp_innen":"19.8","feucht_innen":"51.7"},
    {"id":"322","datum":"12.12.2016","time":"19:22","temp_innen":"19.8","feucht_innen":"51.7"},
    {"id":"323","datum":"12.12.2016","time":"19:32","temp_innen":"19.8","feucht_innen":"51.7"},
    {"id":"324","datum":"12.12.2016","time":"19:42","temp_innen":"19.8","feucht_innen":"51.7"},
    {"id":"325","datum":"12.12.2016","time":"19:52","temp_innen":"19.8","feucht_innen":"51.6"},
    {"id":"326","datum":"12.12.2016","time":"20:02","temp_innen":"19.8","feucht_innen":"51.6"},
    {"id":"327","datum":"12.12.2016","time":"20:12","temp_innen":"19.8","feucht_innen":"51.5"},
    {"id":"328","datum":"12.12.2016","time":"20:22","temp_innen":"19.8","feucht_innen":"51.6"},
    {"id":"329","datum":"12.12.2016","time":"20:32","temp_innen":"19.8","feucht_innen":"51.4"},
    {"id":"330","datum":"12.12.2016","time":"20:42","temp_innen":"19.8","feucht_innen":"51.4"},
    {"id":"331","datum":"12.12.2016","time":"20:52","temp_innen":"19.8","feucht_innen":"51.4"},
    {"id":"332","datum":"12.12.2016","time":"21:02","temp_innen":"19.8","feucht_innen":"51.4"}
]

现在我只想将一些列提取到单个数组中。它应该是这样的：

每一列，即标签“基准”应该在一个数组中，每个“时间”标签等等。

目标是制作一个chartjs折线图，显示固定时间的温度和湿度。

到目前为止我已经尝试过：

$.getJSON( "/php/logabfrage.php", function(data) {
    var Datum = [], Zeit = [], Temp = [], Hum = [];

    $.each(data, function(index, value) {
        Datum.push(new Date(data.datum));
        Zeit.push(new Date(data.zeit));
        Temp.push(parseFloat(data.temp_innen));
        Hum.push(parseFloat(data.feucht_innen));
    });
});

但这并没有得到我想要的结果。也许有人可以帮助我或将我带到正确答案的问题这里，因为我没有在互联网上找到与我的问题类似的东西。

最后应该是这样的：

var date = [date1, date2, ..., dateN];
var temp = [temp1, temp2, ..., tempN];

等等。

【问题讨论】：

仅供参考 $.getJSON() 是一个 Ajax 函数。
data.datum 什么... data 是一个数组...
你只写but this doesnt get me the result i want. 但不清楚想要的结果是什么。请说明您期望它的外观以及这与您当前的结果有何不同。
var Date [1: date1, 2: date2,..., n: date n] - 这不是一个有效的数组，但最好构造一个像var dateItems = [date1, date2,..., date n]这样的普通数组
在each中使用value.datum而不是data.datum

标签： jquery arrays json object

【解决方案1】：

您基本上需要一个可以从对象数组中提取特定属性值的函数。

我们可以将此函数称为“pluck”（一些实用程序库将其称为完全相同，see）。很简单：

function pluck(arr, property) {
    return $.map(arr, function (item) {
        return item[property];
    });
}

它将对象数组转换为属性值数组。将某物数组转换为其他物数组的过程通常称为“map”，“pluck”只是“map”操作的一种特殊类型。这里我们使用 jQuery 的内置函数，但现在也有 JS-native Array#map 可用，如果您愿意，可以使用它。

var a = pluck([{a: 1, b: 2}, {a: 3, b: 4}], "a");
// -> [1, 3]

现在我们可以使用这个函数从您的基础数据中提取像feucht_innen 这样的值序列。 ChartJS 更喜欢这种格式的数据集定义：

[{
    data: pluck(response, "temp_innen"),
    label: "Temperatur innen"
},{
    data: pluck(response, "feucht_innen"),
    label: "Feuchtigkeit innen"
}]

剩下的就是让 ChartJS 看起来不错，可以看到 over here。

您剩下的任务是将其与您的 Ajax 调用集成并找到更好的日期/时间传输格式。我会把它作为练习留给你。

【讨论】：

有点晚了，但谢谢你。我将尝试按照建议使用它。看起来它的工作量比我的解决方案少。
没有一个快速的班轮吗？我的意思是，如果你可以用phpAjaxArray.forEach(({a}) => console.log(a)); 这样的行记录它，你应该能够将它放入一个数组而不是记录它。
@BrianWiley 不确定你的意思。如果必须，您可以重写我提供的函数以适应一行。使用胖箭头函数和 ES6 数组方法，它变得非常短。

【解决方案2】：

最简单的答案是您想要value 而不是data（这是原始数组）

$.each(data, function(index, value) {                  
       Datum.push(new Date(value.datum));
       Zeit.push(new Date(value.zeit));
       Temp.push(parseFloat(value.temp_innen));
       Hum.push(parseFloat(value.feucht_innen));
   });

【讨论】：

谢谢，这就是问题所在。我将不得不看看使用我的函数中提供的正确数据。在提供“价值”时使用“数据”是行不通的。