Question

我正在制作一个从数组中获取项目的js代码。一个问题：具有相同值的项目返回未定义或消失。我尝试了很多不同的东西，但没有任何工作。这是一个jsfiddle：https://jsfiddle.net/76e40vqg/5/

var data =
    [{"image":"link1","name":"Name1","address":"Address1","rate":"4.4"},
    {"image":"link2","name":"Name2","address":"Address2","rate":"3.3"},
    {"image":"link3","name":"Name3","address":"Address3","rate":"3.3"}
];

var restoName = [];
for(i = 0; i < data.length; i++){    
    if(restoName.indexOf(data[i].name) === -1){
        restoName.push(data[i].name);        
    }        
}

var restoAddress = [];
for(i = 0; i < data.length; i++){    
    if(restoAddress.indexOf(data[i].address) === -1){
        restoAddress.push(data[i].address);        
    }        
}

var restoRate = [];
for(i = 0; i < data.length; i++){    
    if(restoRate.indexOf(data[i].rate) === -1){
        restoRate.push(data[i].rate);        
    }        
}

var restoImage = [];
for(i = 0; i < data.length; i++){    
    if(restoImage.indexOf(data[i].image) === -1){
        restoImage.push(data[i].image);
    }        
}

for(i = 0; i < restoName.length; i++){
document.getElementById('output').innerHTML += "Image : <a href='" + restoImage[i] + "'><div class='thumb' style='background-image:" + 'url("' + restoImage[i] + '");' + "'></div></a><br>" + "Name : " + restoName[i] + "<br>" + "Address : " + restoAddress[i] + "<br>" + "Rate : " + restoRate[i] + "<br>" + "Index" + "<br><hr>";
  }

Answer 1

JS Fiddle中的这段代码：

if (restoRate.indexOf(data[i].rate) === -1)
{
    restoRate.push(data[i].rate);
}

从字面上说，如果没有值3.3，请将其推入restoRate。否则，不要推它。

换句话说，第二个3.3没有被推送，因为这是你想要的（已经实现），因此索引3没有价值，你得到undefined。< / p>

编辑：建议的解决方案可能不够

要修复它，请不要检查唯一性，就像这样（没有周围的if()）：

restoRate.push(data[i].rate);

目前尚不清楚这是否是您需要的代码，因此您可能需要重新考虑代码的某些部分。在这种情况下，我们无法帮助您，或者更好地使用其他代码来提出另一个精确的问题。

编辑2 ：具有唯一性的更好解决方案

您添加了唯一性检查，因此您可能仍需要它。您必须做的第一步是确定键是什么。你可能想要添加一个id因为人们可能有相同的名字但仍然是不同的人，如果你理解我的意思：

{"id": 45, "image":"link1","name":"Name1","address":"Address1","rate":"4.4"},
{"id": 46, "image":"link2","name":"Name1","address":"Address2","rate":"4.1"}

此示例显示两个具有相同名称但两个完全不同的情况的条目。 id是用于区分条目的实际键。

如果您这样做，则必须检查id的唯一性：

if (restoId.indexOf(data[i].id) === -1) // this id is new
{
    restoId.push(data[i].id);
    restoImage.push(data[i].image);
    restoName.push(data[i].name);
    restoAddress.push(data[i].address);
    restoRate.push(data[i].rate);
}

如果您无法添加id，则必须使用name，例如：

if (restoName.indexOf(data[i].name) === -1) // this id is new
{
    restoImage.push(data[i].image);
    restoName.push(data[i].name);
    restoAddress.push(data[i].address);
    restoRate.push(data[i].rate);
}

这可能是，也可能不是你需要的。没有实际数据和完整代码，任何人都无法分辨。

Answer 2

我发现你有意通过放置

来避免重复

if(restoRate.indexOf(data[i].rate) === -1)

如果删除此检查，则不会出现显示重复代码的问题。

我还可以将所有这些添加到一起并进行检查以避免重复的名称。如下所示：

 if(restoName.indexOf(data[i].name) === -1){
    restoName.push(data[i].name); 
    restoAddress.push(data[i].address);
    restoRate.push(data[i].rate);
    restoImage.push(data[i].image);
}

Please check this jsfiddle for implementation

Answer 3

您的代码按照您编写的restoRate.indexOf(data[i].rate) === -1工作表示您的数组不包含任何值。例如

var array = [2, 9, 9];
array.indexOf(2);     // 0
array.indexOf(7);     // -1
array.indexOf(9, 2);  // 2
array.indexOf(2, -1); // -1
array.indexOf(2, -3); // 0

请检查javascript中的indexOf概念

Answer 4

您没有在价格数组if(restoRate.indexOf(data[i].rate) === -1)中插入重复值，这就是显示中未定义的说法。

此外，尝试实现所有内容，而不需要创建4个新的for循环。我认为可以在不创建任何新数组变量并仅迭代原始数组的情况下完成。 Big O会更少，性能也会很好。

var restoRate = [];
for(i = 0; i < data.length; i++){    
    if(restoRate.indexOf(data[i].rate) === -1){
        restoRate.push(data[i].rate);        
    }        
}

数组中的重复值会导致显示未定义

4 个答案: