使用JS获取数组内对象的索引

时间:2016-10-08 11:55:00

标签: javascript arrays object

我正在制作一个从数组中获取对象的js代码。我只想要一个带有对象索引的脚本并将其打印在html页面上。我尝试了很多不同的东西,但没有任何工作。例如,让我们说第一个{}是0,然后速率3.3的第二个是1 ...这是一个jsfiddle:https://jsfiddle.net/76e40vqg/1/

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.2"}
];
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>";
  }

谢谢

2 个答案:

答案 0 :(得分:1)

我认为你遗失了..."Index" + i +"<br>...

https://jsfiddle.net/76e40vqg/4/

@Nina Scholz的解决方案也在发挥作用。

答案 1 :(得分:0)

您只需使用一个循环就可以使用Array#forEach显示数据。

  

forEach() 方法为每个数组元素执行一次提供的函数。

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.2" }];

data.forEach(function (object, index){
    console.log('index', index);
    console.log('image', object.image);
    console.log('name', object.name);
    console.log('address', object.address);
    console.log('rate', object.rate);
    console.log('--');
});

传统的for循环和索引i

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.2" }],
    i;

for (i = 0; i < data.length; i++) {
    console.log('index', i);
    console.log('image', data[i].image);
    console.log('name', data[i].name);
    console.log('address', data[i].address);
    console.log('rate', data[i].rate);
    console.log('--');
}

相关问题