How to extract data from json nested objects?

Question

I have JSON file as below and I want to extract placeName's valus which is "Ince Minaret Medrese" and "Karatay, Konya" and lat's and long's values which are 37.8728 and 32.49 and for "Karatay, Konya" lat's value is 37.8667 and long's value is 32.5289

{
    "head": {
        "link": [],
        "vars": ["placeName", "lat", "long"]
    },
    "results": {
        "distinct": false,
        "ordered": true,
        "bindings": [{
                "placeName": {
                    "type": "literal",
                    "xml:lang": "en",
                    "value": "Ince Minaret Medrese"
                },
                "lat": {
                    "type": "typed-literal",
                    "datatype": "http://www.w3.org/2001/XMLSchema#float",
                    "value": "37.8728"
                },
                "long": {
                    "type": "typed-literal",
                    "datatype": "http://www.w3.org/2001/XMLSchema#float",
                    "value": "32.49"
                }
            },
            {
                "placeName": {
                    "type": "literal",
                    "xml:lang": "en",
                    "value": "Karatay, Konya"
                },
                "lat": {
                    "type": "typed-literal",
                    "datatype": "http://www.w3.org/2001/XMLSchema#float",
                    "value": "37.8667"
                },
                "long": {
                    "type": "typed-literal",
                    "datatype": "http://www.w3.org/2001/XMLSchema#float",
                    "value": "32.5289"
                }
            }
        ]
    }
}

I tried to do it this way

    <p id="demo"></p>

    <script>

    var obj =    {
        "head": {
            "link": [],
            "vars": ["placeName", "lat", "long"]
        },
        "results": {
            "distinct": false,
            "ordered": true,
            "bindings": [{
                    "placeName": {
                        "type": "literal",
                        "xml:lang": "en",
                        "value": "Ince Minaret Medrese"
                    },
                    "lat": {
                        "type": "typed-literal",
                        "datatype": "http://www.w3.org/2001/XMLSchema#float",
                        "value": "37.8728"
                    },
                    "long": {
                        "type": "typed-literal",
                        "datatype": "http://www.w3.org/2001/XMLSchema#float",
                        "value": "32.49"
                    }
                },
                {
                    "placeName": {
                        "type": "literal",
                        "xml:lang": "en",
                        "value": "Karatay, Konya"
                    },
                    "lat": {
                        "type": "typed-literal",
                        "datatype": "http://www.w3.org/2001/XMLSchema#float",
                        "value": "37.8667"
                    },
                    "long": {
                        "type": "typed-literal",
                        "datatype": "http://www.w3.org/2001/XMLSchema#float",
                        "value": "32.5289"
                    }
                }
            ]
        }
    }
;
    var myJSON = JSON.parse(obj);
    document.getElementById("demo").innerHTML = myJSON.results.bindings[0].placeName.value;

    </script>

but I don't get any results, how am I supposed to extract data from nested objects?

Answer 1

Respectively:

obj['results']['bindings'][0]['placeName']['value']

obj['results']['bindings'][1]['placeName']['value']

obj['results']['bindings'][1]['lat']['value']

obj['results']['bindings'][1]['long']['value']

obj['results']['bindings'][0]['lat']['value']

obj['results']['bindings'][0]['long']['value']

You can also use dot notation (eg obj.results.bindings[1].long.value), which is recommended if you know the indexes before you access them.

FYI: You don't need to parse the object because it is already JSON.

 var obj = { "head": { "link": [], "vars": ["placeName", "lat", "long"] }, "results": { "distinct": false, "ordered": true, "bindings": [{ "placeName": { "type": "literal", "xml:lang": "en", "value": "Ince Minaret Medrese" }, "lat": { "type": "typed-literal", "datatype": "http://www.w3.org/2001/XMLSchema#float", "value": "37.8728" }, "long": { "type": "typed-literal", "datatype": "http://www.w3.org/2001/XMLSchema#float", "value": "32.49" } }, { "placeName": { "type": "literal", "xml:lang": "en", "value": "Karatay, Konya" }, "lat": { "type": "typed-literal", "datatype": "http://www.w3.org/2001/XMLSchema#float", "value": "37.8667" }, "long": { "type": "typed-literal", "datatype": "http://www.w3.org/2001/XMLSchema#float", "value": "32.5289" } } ] } }; console.log(obj['results']['bindings'][0]['placeName']['value'], obj['results']['bindings'][1]['placeName']['value'], obj['results']['bindings'][1]['lat']['value'], obj['results']['bindings'][1]['long']['value'], obj['results']['bindings'][0]['lat']['value'], obj['results']['bindings'][0]['long']['value']); 

Answer 2

Your code is correct actually, just remove JSON.parse() because the parameter you are passing to the parse method is not a json string, its an actual object
So do it the following way.
var myJSON = obj; And it will start working.

Answer 3

You can using filter

var result = data.results.bindings.filter(function( obj ) {
    return obj.placeName.value == "Ince Minaret Medrese";
});

See the MDN Docs on Array.prototype.filter()

 var data = { "head": { "link": [], "vars": ["placeName", "lat", "long"] }, "results": { "distinct": false, "ordered": true, "bindings": [{ "placeName": { "type": "literal", "xml:lang": "en", "value": "Ince Minaret Medrese" }, "lat": { "type": "typed-literal", "datatype": "http://www.w3.org/2001/XMLSchema#float", "value": "37.8728" }, "long": { "type": "typed-literal", "datatype": "http://www.w3.org/2001/XMLSchema#float", "value": "32.49" } }, { "placeName": { "type": "literal", "xml:lang": "en", "value": "Karatay, Konya" }, "lat": { "type": "typed-literal", "datatype": "http://www.w3.org/2001/XMLSchema#float", "value": "37.8667" }, "long": { "type": "typed-literal", "datatype": "http://www.w3.org/2001/XMLSchema#float", "value": "32.5289" } } ] } }; var result = data.results.bindings.filter(function( obj ) { return obj.placeName.value == "Ince Minaret Medrese"; }); console.log(result)