Доступ к свойствам массива объектов

Question

Это массив:

[
  {
    "name": "Meowsy",
    "species" : "cat",
    "foods": {
      "likes": ["tuna", "catnip"],
      "dislikes": ["ham", "zucchini"]
    }
  },
  {
    "name": "Barky",
    "species" : "dog",
    "foods": {
      "likes": ["bones", "carrots"],
      "dislikes": ["tuna"]
    }
  },
  {
    "name": "Purrpaws",
    "species" : "cat",
    "foods": {
      "likes": ["mice"],
      "dislikes": ["cookies"]
    }
  }
]

Это мой JS-код:

(function($){
    $('button').on( 'click', function(){
    $.ajax({
        url: 'https://raw.githubusercontent.com/LearnWebCode/json-example/master/animals-1.json',
      dataType: 'json',
      success: function(data){
        $('p').html(data[0].name)
      }
    })
  })
})(jQuery)

С этим я могу показать Meowsy, но мне нужно только имя собаки (Барки) и не любит (тунец), как я могу это сделать?

https://jsfiddle.net/g1rjwL7y/

Answer 1

ваши данные как

let data=
      [ { "name"    : "Meowsy"
        , "species" : "cat"
        , "foods"   : { "likes"    : ["tuna", "catnip"]
                      , "dislikes" : ["ham", "zucchini"]
                      }
        }
      , { "name"    : "Barky"
        , "species" : "dog"
        , "foods"   : { "likes"    : ["bones", "carrots"]
                      , "dislikes" : ["tuna"]
                      }
        }
      , { "name"    : "Purrpaws"
        , "species" : "cat"
        , "foods"   : { "likes"    : ["mice"]
                      , "dislikes" : ["cookies"]
                      }
        } 
      ]


BarkySearh = data.find(e=>e.name==='Barky')  // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find

console.log ( BarkySearh.foods.dislikes[0]) // -> tuna

Answer 2

Барки = data[1].name

Тунец = data[1].foods.dislikes[0]