JavaScript JSON
What Is 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() mathod converts a JavaScript value into JSON text.
A JSON Example
Example
This JSON text describes a person object:
{
"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"
};
JSON Text
{
"name": "John",
"age": 30,
"city": "New York"
}
JSON is Text
JSON is not a JavaScript object.
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);
Try it Yourself »
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.
You will learn more about JSON.stringify() later in this tutorial.
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;
Try it Yourself »
You will learn more about JSON.stringify() later in this tutorial.
JSON Round Trip
JSON text
🠇
JSON.parse()
🠇
JavaScript value
🠇
JSON.stringify()
🠇
JSON text
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.
You can receive pure text from a server and use it as a JavaScript object.
You can send a JavaScript object to a server in pure text format.
You can work with data as JavaScript objects, with no complicated parsing and translations.
JSON Files
JSON data can be stored in a file.
JSON files normally use the .json file extension.
- The file type for JSON files is ".json"
- The MIME type for JSON text is "application/json"
JavaScript can load JSON files and convert their contents into JavaScript values.
You will learn how to load JSON files later in this tutorial.
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
