javascript 我应该如何在 JSON 中表示表格数据？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5863304/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How should I represent tabular data in JSON?
提问by Justin Force
I'm writing an API for retrieving data from a JDBC-connected Java Servlet via JSON. I've chosen to use JSON because we'll want to do sorts and other operations on the data in the browser, and we'll be accessing the data from across domains.
我正在编写一个 API，用于通过 JSON 从连接 JDBC 的 Java Servlet 中检索数据。我选择使用 JSON 是因为我们希望对浏览器中的数据进行排序和其他操作，并且我们将访问来自跨域的数据。
Since I'm essentially doing SQL queries in JavaScript, the data that comes back is tabular in nature. I started to write this so that you get back a list of column labels, then arrays of values, for example:
由于我本质上是在 JavaScript 中执行 SQL 查询，因此返回的数据本质上是表格形式。我开始写这个是为了让你得到一个列标签列表，然后是值数组，例如：
{
"columns": [
"given_name",
"surname",
],
"results": [
[
"Joe",
"Schmoe"
],
[
"Jane",
"Doe"
]
]
}
But as I start to write the JavaScript to deal with the returned data, I wonder if it might be better to just output the results with key/value pairs, such as:
但是当我开始编写 JavaScript 来处理返回的数据时，我想知道是否只输出带有键/值对的结果会更好，例如：
{
"results": [
{
"given_name": "Joe",
"surname": "Schmoe"
},
{
"given_name": "Jane",
"surname" : "Doe"
}
]
}
If you're returning a lot of results, that's a lot of repeated text. But we're going to be transporting gzipped, so I'm not too concerned about bandwidth.
如果您返回很多结果，那就是很多重复的文本。但是我们将传输 gzip 格式，所以我不太关心带宽。
Basically, should I engineer this so that I'm accessing my data with
基本上，我应该设计这个以便我访问我的数据
$.getJSON(query, function(data) {
var columns = data.columns;
var results = data.results;
$.each(results, function(key, row) {
console.log(row[columns.indexOf('surname')]);
});
});
or the much prettier
或者更漂亮的
$.getJSON(query, function(data) {
var results = data.results;
$.each(results, function(key, row) {
console.log(row.surname);
});
});
?
?
Essentially, I want to know if the potential hit to performance justifies the much cleaner syntax of the latter option.
本质上，我想知道对性能的潜在影响是否证明后一个选项的语法要简洁得多。
Follow up
跟进
I did implement it both ways and profile. Profiling was a great idea!The differences in performance were marginal. The differences in data transfer size were substantial, but with Gzip compression, the variance was down to 5-6% between both formats andbetween very large and very small data sets. So I'm going with the prettier implementation. For this particular application, I can expect all clients to support Gzip/Deflate, so the size doesn't matter, and the computational complexity on both the client and server is similar enough that it doesn't matter.
我确实实现了它的两种方式和配置文件。分析是个好主意！性能差异很小。在数据传输大小的差异是显着的，但与Gzip压缩，方差下降到5-6％这两种格式之间和非常大和非常小的数据集之间。所以我要使用更漂亮的实现。对于这个特定的应用程序，我可以期望所有客户端都支持 Gzip/Deflate，因此大小无关紧要，并且客户端和服务器上的计算复杂度足够相似，因此无关紧要。
For anyone interested, here is my data with graphs!.
对于任何感兴趣的人，这是我的图表数据！。
采纳答案by Robert Paulson
Synthesizing other answers:
综合其他答案：
- Your wire format doesn't have to be the same as your in-memory format.
- Profile which is better - see if it makes a difference.
- Simpler is usually better to start with.
- 您的有线格式不必与您的内存格式相同。
- 配置文件哪个更好 - 看看它是否有所作为。
- 开始时通常越简单越好。
Further:
更远：
- If you just have a page of results, and few users, then the 2nd format maybe no worse than the 1st format.
- If your data is quite sparse, the 2nd format maywell be better.
- If you're sending 1000's or rows of data, and you have millions of users, then it's possible that the size of data you send can start to matter, and perhaps the 1st format mayhelp.
- You can't guarantee that all user agents support gzip / deflate, so bear this in mind.
- 如果你只有一页结果，而用户很少，那么第二种格式可能不会比第一种格式差。
- 如果您的数据非常稀疏，则第二种格式可能会更好。
- 如果您要发送 1000 行或 1000 行数据，并且拥有数百万用户，那么您发送的数据大小可能会开始变得重要，也许第一种格式可能会有所帮助。
- 你不能保证所有的用户代理都支持 gzip / deflate，所以请记住这一点。
回答by Alex Reynolds
Profile both. Optimize afterwards.
简介两者。后期优化。
回答by Vinicius
Just another JSON structure from which I got very nice results:
只是另一个 JSON 结构，我从中得到了非常好的结果：
{
"recordCount": 2,
"data": {
"Id": [1, 2],
"Title": ["First record", "Second record"],
"Value": [18192, 18176]
}
}
Traversing all data:
遍历所有数据：
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());
}
回答by Lumi
You don't have to tie your code to the more compact, but also more cumbersome format. Just write a simple JS adapter to check the returned structure for the presence of columns. If that's missing you're dealing with a plain array of objects. If it's present you can easily map the cumbersome format to the more convenient format.
您不必将代码绑定到更紧凑但也更麻烦的格式。只需编写一个简单的 JS 适配器来检查返回的结构是否存在columns. 如果缺少它，则您正在处理一个普通的对象数组。如果它存在，您可以轻松地将繁琐的格式映射到更方便的格式。
回答by no.good.at.coding
FWIW I'd go for the second option, it lends itself to cleaner JavaScript as you've observed and will also be easier for a human to read and understand. It seems to me that readability trumps whatever little performance gain you get from option 1.
FWIW 我会选择第二个选项，正如您所观察到的那样，它有助于更清晰的 JavaScript，并且也更容易被人类阅读和理解。在我看来，可读性胜过您从选项 1 中获得的任何一点性能提升。
I also imagine if you were to add more columns or the order of columns changed someday, with the first option, you'll likely have to rewrite a lot of the JavaScript since you'll be working with the position of the data in the response.
我还想象如果有一天您要添加更多列或更改列的顺序，使用第一个选项，您可能需要重写大量 JavaScript，因为您将处理响应中数据的位置.
