AJAX JQuery | accessing returned object data

Question

I am trying to access data returned in an Ajax call I have made. This is referencing the steam API and is successfully returning the data. I have console logged it to check. Whenever I try and access the data i get and undefined console message.

Below is a snippet of my returned JSON file

{
"playerstats": {
    "steamID": "Removed for SO",
    "gameName": "ValveTestApp260",
    "stats": [
        {
            "name": "total_kills",
            "value": 7642
        },
        {
            "name": "total_deaths",
            "value": 7349
        },
        {
            "name": "total_time_played",
            "value": 427839
        },
        {
            "name": "total_planted_bombs",
            "value": 341
        },

Below is the code for my ajax call

$.ajax({
    url: this.props.url,
    dataType: 'json',
    crossDomain: true,
    success: function(data) {
        console.log("success", typeof data);
        console.log(data.playerstats.stats.total_kills);
        console.log(data["playerstats"]["stats"]["total_kills"]);
    }.bind(this),
        error: function(xhr, status, err, data) {
        console.error(this.props.url, status, err.toString());
    }.bind(this)
});

I am successfully entering the success function but it is displaying the following in the console

success object
Inline JSX script:21 undefined
Inline JSX script:22 undefined

the 2 undefined errors are appearing on the console.log line where I have tried accessing the Data the only thing I can think of is that I am accessing them wrong.

Attempts

console.log(data.playerstats.stats.total_kills);
console.log(data["playerstats"]["stats"]["total_kills"]);

Answer 1

total_kills is not a property of stats, nor even a property of every item in stats , but a value of the property "name" , you want the value of the property "value" of every item in the stats array:

$.ajax({
    url: this.props.url,
    dataType: 'json',
    crossDomain: true,
    success: function(data) {
        console.log("success", typeof data);
        data.playerstats.stats.forEach(function (stat) {
            console.log(stat.value);
        });
    }.bind(this),
        error: function(xhr, status, err, data) {
        console.error(this.props.url, status, err.toString());
    }.bind(this)
});

To get only the item which has "total_kills" as the value of its "name" property , you can use this :

var totalKillsObj = data.playerstats.stats.reduce(function(item) {
  return item.name === 'total_kills';
});

var totalKills = totalKillsObj.value;

Answer 2

Demo Fiddle

var data = {
    "playerstats": {
        "steamID": "Removed for SO",
            "gameName": "ValveTestApp260",
            "stats": [{
            "name": "total_kills",
                "value": 7642
        }, {
            "name": "total_deaths",
                "value": 7349
        }, {
            "name": "total_time_played",
                "value": 427839
        }, {
            "name": "total_planted_bombs",
                "value": 341
        }]
    }
}
alert(data.playerstats.steamID);
data.playerstats.stats.forEach(function (stat) {
    alert(stat.name + ":" + stat.value);//property for stats are name and value
});