bugl
bugl
HomeLearnPatternsPathsSearch
HomeLearnPatternsPathsSearch

Loading lesson path

Learn/JavaScript/Objects, Classes, and Advanced Patterns
JavaScript•Objects, Classes, and Advanced Patterns

JSON Object Literals

Flash cards

Review the key moves

1/4
Core idea

What is the main idea behind JSON Object Literals?

Lesson checks

Practice each idea before moving on

Short Mimo-style checks built from this lesson's code, terms, and sequence.

1Quick choice

Which statement best captures the main point of this lesson?

2Fill blank

Complete the missing token from the example code.

'{"___":"John", "age":30, "car":null}'
3Order

Put the learning moves in the order that makes the concept easiest to apply.

Accessing Object Values
JavaScript Objects
JSON Object Literals

This is a JSON string

'{"name":"John", "age":30, "car":null}'

Inside the JSON string there is a JSON object literal:

{"name":"John", "age":30, "car":null}

JSON object literals are surrounded by curly braces {}.

JSON object literals contains key/value pairs.

Keys and values are separated by a colon.

Keys must be strings, and values must be a valid JSON data type: string number object array boolean null

  • string
  • number
  • object
  • array
  • boolean
  • null

Each key/value pair is separated by a comma.

It is a common mistake to call a JSON object literal "a JSON object".

JSON cannot be an object. JSON is a string format.

The data is only JSON when it is in a string format. When it is converted to a JavaScript variable, it becomes a JavaScript object.

JavaScript Objects

myObj = {"name":"John", "age":30, "car":null};
myJSON = '{"name":"John", "age":30, "car":null}';
myObj = JSON.parse(myJSON);

Accessing Object Values

You can access object values by using dot (.) notation:

Example

const myJSON = '{"name":"John", "age":30, "car":null}';
const myObj = JSON.parse(myJSON);
x = myObj.name;

You can also access object values by using bracket ([]) notation:

Example

const myJSON = '{"name":"John", "age":30, "car":null}';
const myObj = JSON.parse(myJSON);
x = myObj["name"];

Looping an Object

You can loop through object properties with a for-in loop:

Example

const myJSON = '{"name":"John", "age":30, "car":null}';
const myObj = JSON.parse(myJSON);
let text = "";
for (const x in myObj) {
  text += x + ", ";
}

In a for-in loop, use the bracket notation to access the property values :

Example

const myJSON = '{"name":"John", "age":30, "car":null}';
const myObj = JSON.parse(myJSON);
let text = "";
for (const x in myObj) {
  text += myObj[x] + ", ";
}

Previous

JSON.stringify()

Next

JSON Array Literals