将敲除与关联数组一起使用答案

【问题标题】：Using knockout with an associative array将敲除与关联数组一起使用
【发布时间】：2014-02-13 21:17:53
【问题描述】：

我对使用淘汰赛 JS 很陌生，因此非常感谢任何帮助！所以基本上我有这样的数据：

    [{ 
   "gjr":{
      "id":"gjr",
      "firstname":"one",
      "companyid":"ff05t5",
      "companyname":"GMC"
   },
   "68g":{
      "id":"68g",
      "firstname":"two",
      "companyid":"ff05t5",
      "companyname":"GMC"
   },
   "ghj":{
      "id":"ghj",
      "firstname":"three",
      "companyid":"a23atr",
      "companyname":"Ford"
   },
   "68f":{
      "id":"68f",
      "firstname":"four",
      "companyid":"ff05t5",
      "companyname":"GMC"
   },
   "f78":{
      "id":"f78",
      "firstname":"five",
      "companyid":"gjd94d",
      "companyname":"Jaguar"
   },
   "fh5":{
      "id":"fh5",
      "firstname":"six",
      "companyid":"gjd94d",
      "companyname":"Jaguar"
   }
}]

我想要做的是用这些数据填充一个表，所以它看起来像这样：

ID        FirstName         CompanyID         CompanyName<br/>
gjr       one               ff05t5            GMC<br/>
68g       two               ffo5t5            GMC<br/>
ghj       three             a23atr            Ford<br/>

等等……

我想知道这是否可以使用淘汰赛 js 或者有更好的方法吗？到目前为止，我有一个 JSFiddle：

http://jsfiddle.net/GJ7qH/15/

【问题讨论】：

标签： javascript knockout.js multidimensional-array associative-array

【解决方案1】：

不使用任何类型的工具包/lib/框架，这已经（应该）是一项非常容易的任务。
首先，请注意 JS 没有关联数组，它有数组（本质上是增强对象）和对象。你正在处理后者。

我会这样做：

var data = yourData[0],//your data is an array, containing a single object literal
    header = [];
    tbl = {},
    p, p2;
for(p in data)
{
    if (data.hasOwnProperty(p))
    {
        for (p2 in data[p])
        {
            if (data[p].hasOwnProperty(p2))
            {
                if (!tbl.hasOwnProperty(p2))
                {
                    header.push(p2);//add header value
                    tbl[p2] = [];//create array
                }
                tbl[p2].push(data[p][p2]);
            }
        }
    }
}

然后，您拥有列出所有可用键的header 数组，在tbl 对象中，您可以找到与每个键对应的值数组。编写一个打印出您需要打印的内容的循环应该很容易。
或者，您可以使用header 数组并生成输出行“实时”：

var data = yourData[0],//your data is an array, containing a single object literal
    header,//leave undefined
    row = [],
    tbl = [],
    p, i, p2;
for(p in data)
{
    if (data.hasOwnProperty(p))
    {
        if (header === undefined)
        {
            header = [];
            for (p2 in data[p])
                header.push(p2);
            tbl.push(header.join("\t"));
        }
        for (i=0;i<header.length;++i)
            row.push(data[p][header[i]]);
        tbl.push(row.join("\t"));
        row = [];//re-initialize
    }
}
console.log(tbl.join("\n"));//should be pretty accurate

现在，这将适用于我所知道的所有浏览器，包括一些人坚持使用的那些糟糕的旧 IE。如果你不太关心这些浏览器（反正我不关心），你可以很容易地这样写：

var data = yourData[0],//your data is an array, containing a single object literal
    header;//leave undefined
    str = '';//output string
    p, i;
for(p in data)
{
    if (header === undefined)
    {//first time over
        header = Object.getOwnPropertyNames(data[p]);
        str = header.join("\t") + "\n";//stringify, tab separated, add new line
    }
    for (i=0;i<header.length;++i)
        str += data[p][header[i]] + "\t";//add value
    str += "\n";
}
console.log(str);//should be close to what you need

免责声明
我已经在脑海中写下了这段代码，没有一个经过测试，所以你可能还有一些调试工作摆在你面前。所有这三个 sn-ps 都是，IMO，非常不言自明，但如果不是很清楚，请随时询问有关给定声明的更多详细信息。

注意：
添加此免责声明后，我实际上在控制台中测试了我在此处提供的最后一个 sn-p，得到的结果是：

id firstname companyid companyname gjr 1 ff05t5 GMC 68g 两个ff05t5 GMC ghj 三 a23atr 福特 68f 四 ff05t5 GMC f78五gjd94d捷豹 fh5 6 gjd94d 捷豹

其中，格式化似乎是你所追求的

【讨论】：

干得好！但我认为他会失去其他“选项”，例如行排序，......无论如何+1
是的，我也不太喜欢使用旧的 IE！我设法使用您的方法使其工作，但我需要敲除该项目的其他方面以及行排序的功能。但是，对于项目的另一部分，您的方法为我回答了一些问题。我真的很感激帮助！谢谢！

【解决方案2】：

.observableArray 方法只接受一个数组，null 或 undefined。

Error: The argument passed when initializing an observable array must be an 
array, or null, or undefined.

你应该处理你的数据来准备一个对象数组。

Here 是我对您的代码所做的更改以使其正常工作。看看吧！

希望对你有帮助。

【讨论】：