Find the null value inside dynamic array list and get the value of this parent

Question

My "spreads" have dynamic array number inside (different numbers per events). Each of the arrays have this alt_line_id: null. I want to get which array object does have this value null value and then display the "home & away" values to my html.

My example array:

"events": [
    "periods": {
        "num_0": {
            "line_id": 2250607026,
            "number": 0,
            "cutoff": "2023-09-18T23:15:00Z",
            "period_status": 1,
            "money_line": {
                "home": 2.5,
                "draw": null,
                "away": 1.598
            },
            "spreads": {
                "3.0": {
                    "hdp": 3.0,
                    "alt_line_id": null,
                    "home": 2.0,
                    "away": 1.909,
                    "max": 30000.0
                },
                "5.5": {
                    "hdp": 5.5,
                    "alt_line_id": 36582376056,
                    "home": 1.625,
                    "away": 2.39,
                    "max": 30000.0
                },
                "5.0": {
                    "hdp": 5.0,
                    "alt_line_id": 36582376059,
                    "home": 1.662,
                    "away": 2.32,
                    "max": 30000.0
                },
                "4.5": {
                    "hdp": 4.5,
                    "alt_line_id": 36582376062,
                    "home": 1.694,
                    "away": 2.26,
                    "max": 30000.0
                },
                "4.0": {
                    "hdp": 4.0,
                    "alt_line_id": 36582376064,
                    "home": 1.746,
                    "away": 2.19,
                    "max": 30000.0
                },
            },
        },
    },
]

In my array above, the "spreads" object have dynamic list of array and for example "3.0" is the one that have "alt_line_id": null. Once it found, I want to get the name of this object so that I can get the "home" & "away" by using calling it like this: obj.events[i].periods.num_0.spreads['**my dynamic array here**'].home

Here's my code

var xhr = new XMLHttpRequest();
xhr.open("GET", "odds.json", true);
xhr.getResponseHeader("Content-type", "application/json");
xhr.withCredentials = true;

xhr.onload = function() {
    const obj = JSON.parse(this.responseText);

    var out = "";
    for (let i = 0; i < obj.events.length; i++) {

        out += '<tr>'
                + '<td class="home_team">'+ obj.events[i].home +'</td>'
                + '<td class="home_moneyline">'+ obj.events[i].periods.num_0.money_line.home +'</td>'
                + '<td class="home_spreads">'+ obj.events[i].periods.num_0.spreads['my dynamic array here'].home +'</td>'
                + '<td class="home_totals">'+  +'</td>'
                + '<td class="home_totalgame">'
                    + '<div>Over <span class="htg_over">'+ obj.events[i].periods.num_0.team_total.home.over +'</span></div>'
                    + '<div>Under <span class="htg_under">'+ obj.events[i].periods.num_0.team_total.home.under +'</span></div>'
                + '</td>'
            + '</tr>'
            + '<tr>'
                + '<td class="away_team">'+ obj.events[i].away +'</td>'
                + '<td class="away_moneyline">'+ obj.events[i].periods.num_0.money_line.away +'</td>'
                + '<td class="away_spreads">'+ obj.events[i].periods.num_0.spreads['my dynamic array here'].away +'</td>'
                + '<td class="away_totals">'+  +'</td>'
                + '<td class="away_totalgame">'
                    + '<div>Over <span class="atg_over">'+ obj.events[i].periods.num_0.team_total.away.over +'</span></div>'
                    + '<div>Under <span class="atg_under">'+ obj.events[i].periods.num_0.team_total.away.under +'</span></div>'
                + '</td>'
            + '</tr>';
    }
    document.getElementById("odds-list").innerHTML = out;
}

Answer 1

for (let i = 0; i < obj.events.length; i++) {
  const spreads = obj.events[i].periods.num_0.spreads;
  const spreadKeys = Object.keys(spreads);
  const nullSpreadKey = spreadKeys.find(key => spreads[key].alt_line_id === null);
  ...
}