时间戳

首页 > 解决方案 > 在 JavaScript 中访问嵌套的对象数组

javascript - 在 JavaScript 中访问嵌套的对象数组

问题描述

我想循环遍历嵌套的对象数组，但我几乎尝试了所有方法，但我不明白它是如何工作的。

我有看起来像这样的对象数据：

[
    {
       "restaurantName":"Bronco",
       "address":"39 Rue des Petites Écuries, 75010 Paris",
       "lat":48.8737815,
       "long":2.3501649,
       "ratings":[
          {
             "stars":4,
             "comment":"Un excellent restaurant, j'y reviendrai !Par contre il vaut mieux aimer la viande."
          },
          {
             "stars":5,
             "comment":"Tout simplement mon restaurant préféré !"
          }
       ]
    },
    {
       "restaurantName":"Babalou",
       "address":"4 Rue Lamarck, 75018 Paris",
       "lat":48.8865035,
       "long":2.3442197,
       "ratings":[
          {
             "stars":5,
             "comment":"Une minuscule pizzeria délicieuse cachéejuste à côté du Sacré choeur !"
          },
          {
             "stars":3,
             "comment":"J'ai trouvé ça correct, sans plus"
          }
       ]
    }
 ]

我想访问评级以获得星星和评论，但我不知道该怎么做。

我也得到 [object object]const coord = { lat: el.lat, long:el.long };

到目前为止，这是我的代码：

fetch("http://localhost/ApiMap/data.json")
.then((response) => response.text())
.then(function(data) {
    data = JSON.parse(data);
    //console.log(data);

    for (const el of data) {
        const name = el.restaurantName;
        const address = el.address;
        const coord =   { lat: el.lat, long:el.long };
        const tabRatings = el.ratings;
        init_resto(name, address, coord, tabRatings);
    }
})
.catch(function(error) {
    console.log('Il y a eu un problème avec l\'opération fetch: ' + error.message);
});

标签： javascriptarraysloopsobjectnested

解决方案

您可以使用以下方法。

  • 使用 Array.forEach() 方法。forEach() 方法为每个数组元素调用一次函数（回调函数）。

  • 在回调函数（dataFilter）内部，值保存每个对象。内部值ratings是一个属性。所以我们value.ratings用来获取收视率数据。

  • ratingsdata 也是一个数组，我们也循环遍历它的每个元素。

var data = [
    {
       "restaurantName":"Bronco",
       "address":"39 Rue des Petites Écuries, 75010 Paris",
       "lat":48.8737815,
       "long":2.3501649,
       "ratings":[
          {
             "stars":4,
             "comment":"Un excellent restaurant, j'y reviendrai !Par contre il vaut mieux aimer la viande."
          },
          {
             "stars":5,
             "comment":"Tout simplement mon restaurant préféré !"
          }
       ]
    },
    {
       "restaurantName":"Babalou",
       "address":"4 Rue Lamarck, 75018 Paris",
       "lat":48.8865035,
       "long":2.3442197,
       "ratings":[
          {
             "stars":5,
             "comment":"Une minuscule pizzeria délicieuse cachéejuste à côté du Sacré choeur !"
          },
          {
             "stars":3,
             "comment":"J'ai trouvé ça correct, sans plus"
          }
       ]
    }
 ];
 
 function dataFilter(value, index, array){
 
    for(var i = 0; i< value.ratings.length; i++ ){
        console.log("comment: "+ value.ratings[i].comment);
        console.log("stars:" +value.ratings[i].stars);
    }
 }
 
data.forEach(dataFilter);

推荐阅读