JSON stands for JavaScript Object Notation. It is easy for a user to read and write. It is a lightweight format, used for storing and transporting data. Data can be formatted using JSON. It looks like to object literal syntax. However, it is not just plain text data. Many times, it uses when data is sent from a server to a web page.
JSON Data
It is written as key and value pairs, just like JavaScript object properties. Key contains the name of the field, always in double-quotes. The value can be any data type as in the following table.
For Example:
{
"name": John,
"age": 31,
"gender": male
}
Keys
Key are “name”, “age”, and “gender’. It separated from the value by a colon. And each key and value pair is separated by a comma. However, remember there is no common after the last key and value pair.
Values
The value can be any of the following data types as shown in the following table.
string | Text must be written in double quotes |
number | Number |
boolean | true or false |
array | Array of value |
object | This can be contain child objects or array |
null | This is when the value in empty or missing |
JSON Syntax Rules
There are some rules as follow as.
- Data is in key/value pairs
- Separate data by commas(:)
- Objects are written inside curly braces{}
- Arrays must be written inside square brackets[].
JSON Objects
It written inside curly braces{}. AS JavaScript, objects can contain multiple name/value pairs:
For example:
{"firstName":"John", "age":"21"}
JSON Arrays
It written inside square brackets[]. Just like in JavaScript, an array can contain objects:
For example:
var text = '{"persons":[' +
'{ "name":"John" , "age":"24" },' +
'{ "name":"Annu" , "age":"30" },' +
'{ "name":"Ray" , "age":"32" }
]
}';
How JSON work with Data

Convert JSON data into JavaScript object.
It commonly used to read data from a web server. And display the data on a web page. First, create a JavaScript string containing JSON syntax using (a string as input):
var text = '{ "persen" : [' +
'{ "name":"John" , "age":"24" },' +
'{ "name":"Annu" , "age":"30" },' +
'{ "name":"Ray" , "age":"32" }
]
}';
Here we have an object representing the three persons stored in an array called person. Now, we use JSON.parse() function. It is a built-in function, used to convert a string into a JavaScript object.
var obj = JSON.parse(text);
Finally, use the new JavaScript object :
<!DOCTYPE html>
<html>
<body>
<h2>Create Object from JSON String</h2>
<p id="demo"></p>
<script>
var text = '{"persons":[' +
'{ "name":"John" , "age":"24" },' +
'{ "name":"Annu" , "age":"30" },' +
'{ "name":"Ray" , "age":"32" } ]}';
obj = JSON.parse(text);
document.getElementById("demo").innerHTML =
obj.persons[1].name + " " + obj.persons[1].age;
</script>
</body>
</html>
As a Result:

Convert a JavaScript object into a string .
JSON.stringify() function converts the JavaScript objects into string. This allows us to send JavaScript objects from one browser to another application.
We have an Object named a person.
var person = { name: "John", age: 30, city: "India" };
Use the JavaScript function JSON.stringify()
to convert object into a string.
var myJSON = JSON.stringify(person);
newJSON
is now a string. Ready to sent to a server:
<!DOCTYPE html>
<html>
<body>
<h2>Create JSON string from a JavaScript object.</h2>
<p id="demo"></p>
<script>
var person = { name: "John", age: 30, city: "India" };
var newJSON = JSON.stringify(person);
document.getElementById("demo").innerHTML = newJSON;
</script>
</body>
</html>
As a Result:

Recommended posts
How to define constant in java
Difference between the Java and JavaScript
Implementation of Array class in JavaScript