JSON Tutorial – Learn JSON Quickly

This JSON Tutorial is a quick overview of JSON concepts and its usages.This simple brief JSON Tutorial Will be very beneficial for beginners.

JSON stands for JavaScript Object Notation is a language independent lightweight data-interchange format.The syntax of JSON is based upon JavaScript script syntax.

JSON objects are used for the exchange of data between applications and services.

XML is another known data exchange format.

But JSON has several advantages over XML in data object handling, mainly that JSON objects are very lightweight.

Major Features of JSON

• JSON is purely text based, human readable data exchange format
• JSON is lightweight compared to XML
• JSON is a language-independent format and uses programmer friendly conventions
• JSON is an easy format to read and write for human
• JSON is easy for machines to parse and generate
• The filename extension of JSON is .json
• Internet Media type of JSON is application/json.

What are the Uses of JSON

• JSON is mainly used for data exchange between a client and server in web applications and other modern language applications.
• JSON data format can be easily serialized and transmitted across the network.
• JSON can be used in Javascript based applications such as websites and browser extensions
• We can use JSON format, which is language independent, to provide data publicly in Web services and APIs

JSON Sample

Below given JSON sample format shows how JSON syntax represents the information of 3 employees in an organization.

{
"Employee":
 [
  { "EmpId":"E0001","Name": "Peter", "Designation": "Programmer","Salary": "20000"} ,
  { "EmpId":"E0002","Name": "Tom","Designation": "System Administrator","Salary": "25000"},
  { "EmpId":"E0003","Name": "Mary", "Designation": "Web Designer","Salary": "20000"}
 ]
}

From the above JSON structure , it is clear that how simpler the schema is compared to XML.

JSON – DataTypes

As like all other programming languages, JSON support data types such as,

string
number (integer,fraction,exponent)
boolean (true, false)
object
array
null

JSON values can be any of the following types. JSON don’t support DATE data type,

JSON doesn’t support DATE data type.So to store date value in JSON, we need to use a format that can be easily converted as a date object.

JSON Data Structures

JSON has support for mainly two data structures which are common collections in conventional programming.

JSON Objects (Name-value pairs collection), which are similar to hash tables, dictionary, keyed list, associative array etc. in other programming languages.

JSON Arrays (Ordered list), similar to the array, list, vector, etc in other programming languages.

This data structure similarity with modern programming languages also one key factor in JSON becoming a popular data-exchange format.

JSON Objects

• JSON object is just similar to a name-value collection in other programming languages.
• JSON Objects are enclosed in curly braces  ‘{‘  …  ‘}’.
• Name(key) is followed by a colon(:) and then the Value.
• Both name and value should be within double quotes( ”  “).
• JSON Name -Value pairs need to be separated by a comma (, ).
• The keys(names) are to be unique strings.

Example JSON Object

A JSON object variable called “Location” is defined below,

var = Location {
 "City" : "Bangalore",
 "State" : "Karnataka", 
 "Zip" : "560061"
 };

Now the JSON object can be accessed from javascript  to extract the information encapsulated in the object as,
Location.City, Location.State etc.  See below,

document.writeln("City:  " + Location.City);
document.writeln("State: " + Location.State);
document.writeln("Country: "+ Location.Zip);

For looping through JSON Object properties(keys) we can use for in loop as,

for (obj in Location)
{
  document.write(obj);
}

Result: City State Country

Also, we can use square bracket to fetch the values as,

for (key in Location) 
{
   document.write(Location[key]);
}

Result: Bangalore Karnataka 560061

JSON Array Objects

As like normal array objects, JSON object arrays are to store a set of JSON elements which are sequential in nature and can be accessed using the index.

JSON Array is an ordered collection of data elements, enclosed in square brackets with individual data elements separated by a comma.

See a simple example below to create a JSON array object,

var JsonBooks = 
[
   { "name" : "JSON Basics", "price" :  "25$" },
   { "name" : "JSON Simplified", "price" : "30$" },
   { "name" : "JSON Fundamentals", "price" : "20$" }
];

In Javascript, to extract the internal data from JSON array object, we can do as like

x = JsonBooks[0].name; 
y = JsonBooks[1].price;

The result of above statements is JSON Basics & 30$ respectively.

 Nested JSON objects

JSON nested objects are nothing but JSON objects within JSON object

var Players = 
{
 "Cricket" : { "Name" : "Sachin", "Age" :  "40", "Gender" : "male" },
 "Batminton" : { "Name" : "Saina", "Age" : "28", "Gender" : "female" },
 "Tennis" : { "Name" : "Leander", "Age" : "38", "Gender" : "male"}
}

We can access the internal information as below rather than using an index as above.

document.writeln(Players.Cricket.Name);

Conclusion

This simple JSON tutorial for beginners would have given you a basic understanding of JSON. Provide your valuable feedback in the comment section below.Check also the other useful JSON materials from us.