This article is about the basics of JavaScript Object Notation (JSON). The following describes JSON:
- lightweight text data interchange format
- language-independent
- easy to understand
- self-describing
Description
JSON is nothing but a lightweight text data interchange format, that is widely used for describing data. It is easily converted to most programming languages for use in many APIs such as:
- Flicker
- Twitter
- Instagram
- Photobucket
- Google Geocoder
- Tumblr
- Yahoo Travel
- Yahoo Answers
- Yelp
And so on, now offers their result in this format.
It’s a way of annotating data that’s relatively easy for programmers to perform operations like read and write. This helps explain the current context of the use of JSON. It works similarly to Asynchronous JavaScript and XML (AJAX), which generally depends upon the concepts of JavaScript.
Programmers have searched for an easy way to transfer data. Converting JSON to something usable in JavaScript takes one line of code and automatically works in all types of web browsers.
JSON Objects
Creation of objects in JSON is done between a pair of curly brackets. Objects in JSON can have multiple values in this scenario too.
Example
Single pair value in JSON
{ “firstname”:“abhishek” , “lastname”:”jaiswal”},
Multiple pair value in JSON
{ “firstname”:“abhishek” , “lastname”:”jaiswal”},
{ “firstname”:“a1” , “lastname”:”j1”},
{ “firstname”:“a2” , “lastname”:”j2”},
{ “firstname”:“a3” , “lastname”:”j3”},
JSON Array
Just as in other programming languages JSON also uses square [] brackets for representing an array.
Moreover, an array can have multiple objects.
Example
{“student”:[{ “firstname”:“abhishek” , “lastname”:”jaiswal”},
{ “firstname”:“a1” , “lastname”:”j1”},
{ “firstname”:“a2” , “lastname”:”j2”},
{ “firstname”:“a3” , “lastname”:”j3”},]}
The preceding example shows the basic structure of the JSON.
Why JSON?
There are several technologies like JSON, one of the most famous and used among those languages is XML. But there are several differences that create hurdles between JSON and XML. These hurdles provide these functionalities to JSON, which are not present in XML. Some of these features of JSON are as follows:
- There are no ending Tags in JSON.
- No reverse word concept in JSON
- JSON uses the functionality of ARRAYS
- Ease of read and write operations
- Easily works with JavaScript
- can be used in enhancing functionalities of AJAX
- is shorter
- can be parsed using JavaScript
JSON vs XML
- JSON performs read and write operations much more easily than XML
- JSON can be used in AJAX apps in place of XML
- JSON works more effectively than XML
- Enhanced features than XML
JSON Parser
For parsing in JSON we use the eval() function. This function can compile and execute any JavaScript code. It is comparatively safer to use the JSON parser to convert a JSON text to a JavaScript object. A JSON parser will recognize only JSON text written in the code and it's not going to compile script at all.
Some other features of JSON parser are
- It is faster
- It's more convenient
- Reduces complexities
Referenced Example
- <html>
- <head>
- <title>Record</title>
- </head>
- <body>
- <h1>Basics of JSON </h1>
- <p>
- Name <span id="”jName”"></span>
- <br />
- Roll_No <span id="”jRoll_No”"></span>
- <br />
- ID <span id="”jID”"></span>
- <br />
- DOB <span id="”jDOB”"></span>
- <br />
- </p>
- <script>
- var JSONobject= {
- “Name” : “abhishek”,
- “Roll_No” : 123,
- “ID” : “CSE”,
- “DOB” : “JAN 01”,
- );
- document.getElementById
- (“jName”)inner.HTML=JSONobject.Name
-
- document.getElementById
- (“jRoll_No”)inner.HTML=JSONobject. jRoll_No
-
- document.getElementById
- (“jID”)inner.HTML=JSONobject.ID
-
- document.getElementById
- (“jDOB”)inner.HTML=JSONobject.DOB
- </script>
- </body>
- </html>
Output