JavaScript Object Notation (JSON) is a lightweight way to transfer JavaScript object data between a variety of apps and tools as a simple string. It uses a simple notation consisting primarily of braces { }, brackets [ ], commas, and quotes to construct potentially complex data structures.

Objects

JavaScript objects are encapsulated in braces { } as name and value pairs separated with commas. For example, a simple user object might consist of the following:

{
  firstName: "Jane",
  lastName: "Doe",
  email: "janedoe@email.com"
}

Arrays

JavaScript arrays are encapsulated in brackets [ ] as values separated with commas. For example, a simple list of names might consist of the following:

[
  "Jane Doe",
  "John Doe",
  "Teddy Ruxpin"
]

Structuring Data

Objects and arrays can be nested inside one another to create nested data structures, such as in this list of student course schedules:

[
    {
        name: "Jane Doe",
        email: "janedoe@email.com",
        courses: [
            {
                name: "Biology",
                section: "1"
            },
            {
                name: "Chemistry",
                section: "2"
            }
        ]
    },
    {
        name: "Teddy Ruxpin",
        email: "teddy@email.com",
        courses: [
            {
                name: "Philosophy",
                section: "1"
            },
            {
                name: "Chemistry",
                section: "1"
            }
        ]
    }
]

Note that this example consists of an array of user objects that each has an array of course objects.

Based on this schedule, would Jane and Teddy share any course sections?

Yes

No

Retrieving Data

To retrieve a data value from an object, you would reference the object and then the name of the key in the key value pair you desire separated with a period. For instance, we could assign a list of users to a variable as follows:

var user = {
  firstName: "Jane",
  lastName: "Doe",
  email: "janedoe@email.com"
};

Try this in your Inspector Console by pasting the above code and hitting enter. This sets the user variable in your console. Then, if we wanted to return the firstName of the user, we could simply type user.firstName, which would return "Jane". 

Alternatively, you can also access object values by using brackets and quotation marks, such as user["firstName"].

To retrive data from an array, you would reference the array and then the desired item's order number in the array (starting from zero). So, we could assign a list of names to an array as follows:

var userNames = [
  "Jane Doe",
  "John Doe",
  "Teddy Ruxpin"
]

And then we could reference each element by typing userNames[0] (which would return "Jane Doe"), userNames[1] (which would return "John Doe"), etc.

In the case of structured data, like our example above, we can reference data anywhere in the structure by following this pattern. Try pasting the following into your Console:

var studentSchedules = [
    {
        name: "Jane Doe",
        email: "janedoe@email.com",
        courses: [
            {
                name: "Biology",
                section: "1"
            },
            {
                name: "Chemistry",
                section: "2"
            }
        ]
    },
    {
        name: "Teddy Ruxpin",
        email: "teddy@email.com",
        courses: [
            {
                name: "Philosophy",
                section: "1"
            },
            {
                name: "Chemistry",
                section: "1"
            }
        ]
    }
];

Then, retrieve Teddy's email address by typing studentSchedules[1].email .

How would you retrieve the name of Jane's second course?

studentSchedules[0].courses[1].name

studentSchedules[0].name

studentSchedules[0].courses.name