我应该如何在 JSON 中表示表格数据？答案

【问题标题】：How should I represent tabular data in JSON?我应该如何在 JSON 中表示表格数据？
【发布时间】：2011-05-02 22:49:45
【问题描述】：

我正在编写一个 API，用于通过 JSON 从连接 JDBC 的 Java Servlet 中检索数据。我选择使用 JSON 是因为我们希望对浏览器中的数据进行排序和其他操作，并且我们将跨域访问数据。

由于我本质上是在 JavaScript 中执行 SQL 查询，因此返回的数据本质上是表格的。我开始写这个是为了让你得到一个列标签列表，然后是值数组，例如：

{
  "columns": [
    "given_name",
    "surname",
  ],
  "results": [
    [
      "Joe",
      "Schmoe"
    ],
    [
      "Jane",
      "Doe"
    ]
  ]
}

但是当我开始编写 JavaScript 来处理返回的数据时，我想知道用键/值对输出结果是否会更好，例如：

{
  "results": [
    {
      "given_name": "Joe",
      "surname": "Schmoe"
    },
    {
      "given_name": "Jane",
      "surname" : "Doe"
    }
  ]
}

如果您要返回大量结果，那就是大量重复的文本。但是我们将传输 gzipped，所以我不太关心带宽。

基本上，我应该对此进行设计，以便我可以使用

$.getJSON(query, function(data) {
  var columns = data.columns;
  var results = data.results;
  $.each(results, function(key, row) {
    console.log(row[columns.indexOf('surname')]);
  });
});

或者更漂亮的

$.getJSON(query, function(data) {
  var results = data.results;
  $.each(results, function(key, row) {
    console.log(row.surname);
  });
});

?

基本上，我想知道对性能的潜在影响是否证明后一个选项更简洁的语法是合理的。

跟进

我确实实现了它的方式和配置文件。 分析是个好主意！性能差异很小。数据传输大小的差异很大，但使用 Gzip 压缩，两种格式和之间的差异下降到 5-6% 非常大和非常小的数据集。所以我要使用更漂亮的实现。对于这个特定的应用程序，我可以期望所有客户端都支持 Gzip/Deflate，因此大小无关紧要，并且客户端和服务器上的计算复杂度足够相似，这无关紧要。

对于任何感兴趣的人，这里是my data with graphs!。

【问题讨论】：

标签： javascript jquery json

【解决方案1】：

两者的简介。事后优化。

【讨论】：

【解决方案2】：

综合其他答案：

您的有线格式不必与您的内存格式相同。
配置文件哪个更好 - 看看它是否有所作为。
通常越简单越好。

进一步：

如果您只有一页结果，并且用户很少，那么第二种格式可能不会比第一种格式差。
如果您的数据非常稀疏，则第二种格式可能会更好。
如果您要发送 1000 或多行数据，并且您拥有数百万用户，那么您发送的数据大小可能会开始变得重要，也许第一种格式可能会有所帮助.
您不能保证所有用户代理都支持 gzip/deflate，因此请记住这一点。

【讨论】：

感谢您的回答。一个小提示：您不能保证所有用户代理都支持 deflate，但出于实际目的，它们确实支持。 IE4确实放气。 :)
当然，对于现代浏览器来说，大多数浏览器肯定会接受 gzip/deflate。但是，其他人可能会阅读此内容，值得注意的是，并非所有用户代理（不限于浏览器）都不支持它。见west-wind.com/weblog/posts/2011/May/02/…

【解决方案3】：

只是另一个 JSON 结构，我从中得到了非常好的结果：

{
    "recordCount": 2,
    "data": {
        "Id": [1, 2],
        "Title": ["First record", "Second record"],
        "Value": [18192, 18176]
    }
}

遍历所有数据：

for (var i = 0; i < recordSet.recordCount; ++i) {
    console.log("Record " + i.toString() + ":");
    for (var field in recordSet.data)
        console.log("\t" + field + ": " + recordSet.data[field][i].toString());
}

【讨论】：

仅供参考，这被称为“数组结构”（而原始数据是“结构数组”）。例如在perldoc.perl.org/perldsc.html

【解决方案4】：

您不必将代码绑定到更紧凑但也更繁琐的格式。只需编写一个简单的 JS 适配器来检查返回的结构中是否存在 columns。如果缺少这些，您正在处理一个简单的对象数组。如果它存在，您可以轻松地将繁琐的格式映射到更方便的格式。

【讨论】：

【解决方案5】：

FWIW 我会选择第二个选项，正如您所观察到的，它有助于更清洁的 JavaScript，并且也更易于人类阅读和理解。在我看来，可读性胜过从选项 1 获得的任何一点性能提升。

~~我还想如果有一天您要添加更多列或更改列的顺序，使用第一个选项，您可能需要重写大量 JavaScript，因为您将使用该职位响应中的数据。~~

【讨论】：