Javascript : Access JSON data example
Problem:
You have a JSON string such as below and you want to access the data individually via Javascript. How to access the JSON data with Javascript?
{
"name": "adamng",
"age": 38,
"address": {
"street": "108 Street",
"city": "Singapore"
},
"email": [{
"type": "personal",
"address": "adamng@somewherepersonal.com"
}, {
"type": "business",
"address": "adamng@someworkplace.com"
}]
}
Solution:
Use JSON.Parse()
to parse(process) the JSON string into a Javascript JSON Object and access the data via the JSON object.
Here you go!
Save this block of code into test.html
file and view it with your browser.
<html>
<script>
var JSONdata = '{"name": "adamng","age": 38,"address": {"street": "108 Street", "city": "Singapore" },"email": [{"type": "personal","address": "adamng@somewherepersonal.com"}, {"type": "business","address": "adamng@someworkplace.com"}]}';
var JSONObject = JSON.parse(JSONdata);
// retrieve the name
alert("Name :"+JSONObject["name"]);
alert(JSONObject.name);
// retrieve the age
alert(JSONObject["age"]);
alert(JSONObject.age);
alert(JSONObject.address.street);
alert(JSONObject["address"].city);
// access the first email object properties
alert(JSONObject.email[0].address);
// access the second email object properties
alert(JSONObject.email[1].type);
</script>
</html>
See also : Javascript : How to loop over and parse JSON data?
By Adam Ng
IF you gain some knowledge or the information here solved your programming problem. Please consider donating to the less fortunate or some charities that you like. Apart from donation, planting trees, volunteering or reducing your carbon footprint will be great too.
Advertisement
Tutorials
+12.4k Golang : zlib compress file example
+13.4k Golang : Tutorial on loading GOB and PEM files
+5.2k Golang : Display advertisement images or strings on random order
+5.7k Golang : Use NLP to get sentences for each paragraph example
+5.9k PHP : How to handle URI or URL with non-ASCII characters such as Chinese/Japanese/Korean(CJK) ?
+10k Golang : Convert file content to Hex
+8.2k PHP : How to parse ElasticSearch JSON ?
+9.5k Golang : ffmpeg with os/exec.Command() returns non-zero status
+6.8k Golang : Get Alexa ranking data example
+10.5k Golang : Get UDP client IP address and differentiate clients by port number
+5.2k Golang : Get S3 or CloudFront object or file information
+10.7k Golang : Fix go.exe is not compatible with the version of Windows you're running