配列の値が重複すると、未定義が表示される

Question

配列から項目を取得するjsコードを作成していました。 1つの問題：同じ値を持つアイテムは、定義されていないか消えます。私は多くの異なることを試みたが、何も動作していない。 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フィドル中：ここにjsfiddleがある

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

は値3.3がない場合、restoRateに押し込み、文字通り言います。それ以外の場合は、押し込まないでください。

つまり、2番目の3.3はプッシュされません。これは、（実装されている）インデックスであるため、3は値がなく、undefinedとなります。

---

EDIT：おそらくそれを修正するために

不十分で提案するソリューション、（周囲の if()なし）ちょうどこのように、一意性をチェックしません：

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

それこれがコードのさらに下に必要なものなのかどうかは明らかではないので、おそらくコードのいくつかの部分を再考する必要があります。これで、私たちはあなたを助けることができません、またはそれは他のコードと別の、正確な質問が必要です。

---

EDIT 2：一意

とのより良い解決策は、あなたは、一意性のチェックを追加しましたので、あなたはおそらくまだそれを必要とします。最初に行うことは、のキーがであることを決定することです。あなたは私が何を意味するか得れば、人々は、同じ名前を持っていますが、まだ別の人かもしれないのでidを追加することもできます。

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

この例では、同じ名前を持つ2つのエントリが、2つの完全に異なる例を示します。 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); 
} 

あなたは、おそらくこのように、nameで行かなければならないid追加できない場合は、次の

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

あなたのコードは、あなたが書いたとおりに動作します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概念を確認してください、私はあなたがこのチェックを外した場合は、意図的に

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

を配置することにより、重複を避けているの重複を表示何ら問題はないだろう参照

Answer 3

コード。

また、これらのすべてを一緒に追加して、重複する名前を避けるためにチェックを入れることもできます。次に示すように：あなたはあなたのレート配列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 4

、それは、そのディスプレイに未定義言う方法です。

さらに、4つの新しいforループを作成せずにすべてを実装しようとします。私は、新しい配列変数を作成せずに元の配列だけを反復することなく実行できると思います。ビッグオーは少なくなり、パフォーマンスは良くなるでしょう。

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