JavaScript JSON

What Is JSON?

JSON

JSON is a text format for storing and exchanging data.

JSON stands for JavaScript Object Notation.

JSON syntax is similar to JavaScript object syntax.

JSON is language independent.

What Is JSON Used For?

JSON is used to send, receive and store data.

JSON is integrated into JavaScript and many other programming languages.

The JSON.parse() method converts JSON text into JavaScript values.

The JSON.stringify() method converts a JavaScript value into JSON text.

A JSON Example

Example

{

  "name": "John",

  "age": 30,

  "city": "New York"

}

The example above describes an object with 3 properties:

Properties are written as name/value pairs.

Each property has a name:

• "name"
• "age"
• "city"

Each property has a value:

• "John"
• 30
• "New York"

Why Use JSON?

Computers and applications often need to exchange data.

JSON provides a simple text format that many programming languages can read and create.

JSON is commonly used for:

• Sending data from a web server to a web page
• Sending data from a web page to a server
• Storing configuration data
• Saving structured data in files
• Exchanging data between applications

JSON and JavaScript

JSON syntax is based on JavaScript object syntax.

Because the syntax looks similar, JSON text is often confused with JavaScript objects.

JavaScript Object

const person = {

  name: "John",

  age: 30,

  city: "New York"

};

Because the JSON format is syntactically identical to JavaScript, a JavaScript program can easily convert JSON data into native JavaScript values.

JavaScript has a built in function for converting JSON strings into JavaScript values:

JSON.parse()

JavaScript also has a built in function for converting JavaScript values into a JSON strings:

JSON.stringify()

Converting JSON to JavaScript

Before JavaScript can work with JSON text, the text has to be converted into a JavaScript value.

The JSON.parse() method converts JSON text into a JavaScript value:

Example

// JSON text

const text = '{"name":"John", "age":30, "city":"New York"}';

// Parse the JSON text

const person = JSON.parse(text);

After parsing, the properties can be accessed with normal JavaScript object syntax.

The JSON.parse() method does not always return an object.

It returns the JavaScript value represented by the JSON text.

Converting JavaScript to JSON

The JSON.stringify() method converts a JavaScript value into JSON text:

Example

const person = {

  name: "John",

  age: 30,

  city: "New York"

};

const text = JSON.stringify(person);

document.getElementById("demo").innerHTML = text;

JSON Round Trip

Storing Data

When storing data, the data has to be a certain format.

Regardless of where you choose to store data, text is always a handy format.

JSON makes it possible to store JavaScript values as text.

JSON Files

JSON data can be stored in a file.

JSON files normally use the .json file extension.

customer.json

{

  "id": 101,

  "name": "John Doe",

  "city": "New York",

  "member": true

}

• The file type for JSON files is ".json"
• The MIME type for JSON text is "application/json"

JSON Is Language Independent

JSON was inspired by JavaScript object syntax, but it is not limited to JavaScript.

Code for reading and generating JSON data can be written in any programming language.

The JSON format was originally specified by Douglas Crockford.

• JSON is text only and language independent
• JSON makes it easy to send data between computers