How can I access certain values in this JSON string?

Question

This my JSON output. This is a response from an API. I am needing to access the Arrival Time. The only way I have found to succesfully do this in Javsacript and Jquery is by doing this Is there an easier way to access this data?

JSON OUTPUT:

{
    "routes": [
        {
            "id": "f8b5d90a-d2b5-4149-b058-087c27e52fd0",
            "sections": [
                {
                    "id": "c16d58b7-7e2a-4ded-b8b7-96972d4ab0e4",
                    "type": "vehicle",
                    "departure": {
                        "time": "2021-03-02T18:00:00+10:00",
                        "place": {
                            "type": "place",
                            "location": {
                                "lat": -27.4526753,
                                "lng": 153.0426484
                            },
                            "originalLocation": {
                                "lat": -27.45263,
                                "lng": 153.0423499
                            }
                        }
                    },
                    "arrival": {
                        "time": "2021-03-02T18:09:48+10:00",
                        "place": {
                            "type": "place",
                            "location": {
                                "lat": -27.4396845,
                                "lng": 153.0693942
                            },
                            "originalLocation": {
                                "lat": -27.4397501,
                                "lng": 153.06963
                            }
                        }
                    },
                    "transport": {
                        "mode": "car"
                    }
                }
            ]
        }
    ]
}

var totalTime
data = {
    "routes": [
        {
            "id": "f8b5d90a-d2b5-4149-b058-087c27e52fd0",
            "sections": [
                {
                    "id": "c16d58b7-7e2a-4ded-b8b7-96972d4ab0e4",
                    "type": "vehicle",
                    "departure": {
                        "time": "2021-03-02T18:00:00+10:00",
                        "place": {
                            "type": "place",
                            "location": {
                                "lat": -27.4526753,
                                "lng": 153.0426484
                            },
                            "originalLocation": {
                                "lat": -27.45263,
                                "lng": 153.0423499
                            }
                        }
                    },
                    "arrival": {
                        "time": "2021-03-02T18:09:48+10:00",
                        "place": {
                            "type": "place",
                            "location": {
                                "lat": -27.4396845,
                                "lng": 153.0693942
                            },
                            "originalLocation": {
                                "lat": -27.4397501,
                                "lng": 153.06963
                            }
                        }
                    },
                    "transport": {
                        "mode": "car"
                    }
                }
            ]
        }
    ]
}
$.each(data, function(i,value){
totalTime = value[0]['sections']['0']['arrival']['time'];
});
$('#results').text(totalTime);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label id = "results"></label>

it will be easier if you create your own recursion function to search for a specific property or value. check [this source](https://www.programiz.com/javascript/recursion) also [this one](https://stackoverflow.com/a/22222867/8678900) it can help you. — sohaieb azaiez, Mar 02 '21 at 20:34

score 1 · Accepted Answer · answered Mar 02 '21 at 20:34

You don't need $.each(). Just use data.routes.

This hard-coded [0] indexes assume that the time you're interested in is always in the first section of the first route.

data = {
  "routes": [{
    "id": "f8b5d90a-d2b5-4149-b058-087c27e52fd0",
    "sections": [{
      "id": "c16d58b7-7e2a-4ded-b8b7-96972d4ab0e4",
      "type": "vehicle",
      "departure": {
        "time": "2021-03-02T18:00:00+10:00",
        "place": {
          "type": "place",
          "location": {
            "lat": -27.4526753,
            "lng": 153.0426484
          },
          "originalLocation": {
            "lat": -27.45263,
            "lng": 153.0423499
          }
        }
      },
      "arrival": {
        "time": "2021-03-02T18:09:48+10:00",
        "place": {
          "type": "place",
          "location": {
            "lat": -27.4396845,
            "lng": 153.0693942
          },
          "originalLocation": {
            "lat": -27.4397501,
            "lng": 153.06963
          }
        }
      },
      "transport": {
        "mode": "car"
      }
    }]
  }]
}

var totalTime = data.routes[0].sections[0].arrival.time;

$('#results').text(totalTime);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label id="results"></label>

score 0 · Answer 2 · answered Mar 02 '21 at 21:00

For an alternative, defensive solution:

var totalTime
data = {
  "routes": [{
    "id": "f8b5d90a-d2b5-4149-b058-087c27e52fd0",
    "sections": [{
      "id": "c16d58b7-7e2a-4ded-b8b7-96972d4ab0e4",
      "type": "vehicle",
      "departure": {
        "time": "2021-03-02T18:00:00+10:00",
        "place": {
          "type": "place",
          "location": {
            "lat": -27.4526753,
            "lng": 153.0426484
          },
          "originalLocation": {
            "lat": -27.45263,
            "lng": 153.0423499
          }
        }
      },
      "arrival": {
        "time": "2021-03-02T18:09:48+10:00",
        "place": {
          "type": "place",
          "location": {
            "lat": -27.4396845,
            "lng": 153.0693942
          },
          "originalLocation": {
            "lat": -27.4397501,
            "lng": 153.06963
          }
        }
      },
      "transport": {
        "mode": "car"
      }
    }]
  }]
}

var totalTime = data && Array.isArray(data.routes) && Array.isArray(data.routes[0].sections) ? data.routes[0].sections[0].arrival.time : "";

$('body').text(totalTime);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

This will ensure that if no array or result is returned, you still get a value to fall back on.

How can I access certain values in this JSON string?

2 Answers2