JavaScript Tip: Accessing JSON Data



In previous tutorials I have talked about how to load JSON data or retrieve JSON data from a site. In this tutorial we will look at how to access that data once it is retrieved.

For more resources on JavaScript:
http://www.allthingsjavascript.com

Access to EVERY course (get 2 months free): https://www.skillshare.com/r/profile/Steven-Hancock/24508

Courses offered on Udemy at a discount:

Getting Started: https://www.udemy.com/learn-modern-javascript-getting-started/?couponCode=GETTINGSTARTED2019

Advanced Topics: https://www.udemy.com/learn-modern-javascript-advanced-topics/?couponCode=ADVANCED2019

Mastering Regular Expressions in JavaScript:
https://www.udemy.com/mastering-regular-expressions-in-javascript/?couponCode=YOUTUBE

Functional Programming in JavaScript: https://www.udemy.com/functional-programming-in-javascript-a-practical-guide/?couponCode=YOUTUBE19

NEW Mastering JavaScript Arrays: https://www.udemy.com/course/mastering-javascript-arrays/?couponCode=YOUTUBE19

Tutorials referred to in this video:
Basics of JS Objects: https://youtu.be/abP2q8eEXWg
For in loop: https://youtu.be/3sGFoypr8kA
Using Fetch: https://www.youtube.com/watch?v=-ooaEey3X7w&list=PLTo9PCskHpbGVLVtW0XBUVbfeqT5r-SBh
JavaScript Promises: https://www.youtube.com/watch?v=_IGIQ10yX1o&list=PLTo9PCskHpbHIDnzl8tRYldSCSQaFgAHd
JSON Format: https://youtu.be/K6w6giXfUsQ

#javascript #AllThingsJavaScriptLLC

23 thoughts on “JavaScript Tip: Accessing JSON Data

  1. Hello. I am making a Github user info reader. I am trying to fetch the user from the data but it won't work.
    Here is my script:

    let user;
    let findUser = "Bigmancozmo";
    fetch("http://api.github.com/users/" + findUser)
    .then(function(resp){
    return resp.json();
    })
    .then(function(data) {
    console.log(data)
    user = data.login;
    });
    document.getElementById("usr").innerText = user;

    When i run it, it gives me no errors. But when i test it, it only replaces my text with "undefined," not the user's name (the part in every Github user's json data that has their username.) It is supposed to be getting set to "Bigmancozmo," and not "undefined." Even when i do something BESIDES the username, it does not work.

  2. Thank you so much! I'm a super noob and spent a ridiculous amount of time trying to figure out how to access my json data after sending a POST request. You are my hero!

  3. Just a Python programmer here with limited web experience. I wanted to thank you very much for this tutorial. It was absolutely fantastic! Thank you very much.

  4. a question, imagine if we have very large JSON data, we dont want to do the request in all the large list and then format them in the front end, how do we get specific data without doing the request

  5. Vet helpful video 👍🏼….how do I retrieve the info in the array? Like…how do I tell the program… grab the third item, send it to <p id=‘student’><p> in the HTML page?? Thanks in advanced 👍🏼

  6. How do you get the mainObj assigned so you can use it outside of the fetch. It seems weird to have to put all of my entire code inside a fetch just to make it able to access and play with the data?

  7. There's something very aesthetically pleasing about the colors you use on your editor. Reminds me of woodwork.

    Also great tutorial I've managed to get my objects from Json without an issue but accessing individual properties inside the objects is proving tricky.

Leave a Reply

Your email address will not be published. Required fields are marked *