Join Dotnetcodes DotnetCodes.com is online Discussion Forum for Software professionals . It lets you find friends around the world and Create professional network that share similar interests as you. Get help on ur projects by industry specialists. Also get answers to all ur technical/placement related querries.Get an edge over others.
Already MemberClick here to login
ASP.net MVC Interview Questions Answers Interview Questions
Get Started Developing for Android Apps with Eclipse Articles
Serial Number in SSRS Articles
.Net framework 4.0 Interview Questions Answers Interview Questions
SQL server reporting services Interview Questions (SSRS) part 1 Articles
Whats New in ASP.NET 4.0 Part 2 Articles
How to Print a Crystal Report direct to printer Articles
Difference between Encapsulation and Abstraction Interview Questions
Explaining SDLC -System Development Life Cycle Articles
Html5 interview questions and answers Interview Questions
SharePoint 2010 interview Questions Answers Interview Questions
Infosys Interview Questions Interview Questions
Dynamic Menu using HTML List Tag and CSS in ASP.Net Articles
Populate or bind Dropdownlist in Asp.net using Jquery and Json Articles
ASP.NET MVC Overview Interview Questions
Submit Articles | More Articles..

JSON An Introduction Part2

Posted By: [email protected] On:7/28/2010 7:39:49 AM in:Articles Category:JavaScript Hits:1490
JSON is a lightweight format for exchanging data between the client and server. It is often used in Ajax applications because of its simplicity and because its format is based on JavaScript object literals. We will start this lesson by learning JavaScripts object-literal syntax and then we will see how we can use JSON in an Ajax application.


Object Literals

We saw earlier how to create new objects in JavaScript with the Object() constructor. We also saw how we could create our constructors for our own objects. In this lesson, we'll examine JavaScript's literal syntax for creating arrays and objects.

Arrays

Array literals are created with square brackets as shown below:

var Beatles = ["Paul","John","George","Ringo"];

This is the equivalent of:

var Beatles = new Array("Paul","John","George","Ringo");

Objects

Object literals are created with curly brackets:

var Beatles = {
 "Country" : "England",
 "YearFormed" : 1959,
 "Style" : "Rock'n'Roll"
}

This is the equivalent of:

var Beatles = new Object();
Beatles.Country = "England";
Beatles.YearFormed = 1959;
Beatles.Style = "Rock'n'Roll";

Just as with all objects in JavaScript, the properties can be references using dot notation or bracket notation.

alert(Beatles.Style); //Dot Notation
alert(Beatles["Style"]); //Bracket Notation

Arrays in Objects

Object literals can contain array literals:

var Beatles = {
 "Country" : "England",
 "YearFormed" : 1959,
 "Style" : "Rock'n'Roll",
 "Members" : ["Paul","John","George","Ringo"]
}

Objects in Arrays

Array literals can contain object literals:

var Rockbands = [
 {
  "Name" : "Beatles",
  "Country" : "England",
  "YearFormed" : 1959,
  "Style" : "Rock'n'Roll",
  "Members" : ["Paul","John","George","Ringo"]
 },
 {
  "Name" : "Rolling Stones",
  "Country" : "England",
  "YearFormed" : 1962,
  "Style" : "Rock'n'Roll",
  "Members" : ["Mick","Keith","Charlie","Bill"]
 }
]

JSON

On the JSON website (http://www.json.org), JSON is described as:

  1. a lightweight data-interchange format
  2. easy for humans to read and write
  3. easy for machines to parse and generate

Numbers 1 and 3 are certainly true. Number 2 depends on the type of human. Experienced programmers will find that they can get comfortable with the syntax relatively quickly.

JSON Syntax

The JSON syntax is like JavaScript's object literal syntax except that the objects cannot be assigned to a variable. JSON just represents the data itself. So, the Beatles object we saw earlier would be defined as follows:

{
 "Name" : "Beatles",
 "Country" : "England",
 "YearFormed" : 1959,
 "Style" : "Rock'n'Roll",
 "Members" : ["Paul","John","George","Ringo"]
}

JSON Parsers

As JSON is just a string of text and not an object in and of itself, it needs to be converted to an object before to make it useful. Although this can be done in JavaScript with the eval() function, it is safer to use a JSON parser. You can download the JavaScript JSON parser at http://www.json.org/json.js. Including this file on a web page allows you to take advantage of the JSON object, which has the following very useful methods:

  • JSON.parse(strJSON) - converts a JSON string into a JavaScript object.
  • JSON.stringify(objJSON) - converts a JavaScript object into a JSON string.

The process for sending data between the browser and server with JSON is as follows:

  1. On the client-side:
    • Create a JavaScript object using the standard or literal syntax.
    • Use the JSON parser to stringify the object.
    • Send the URL-encoded JSON string to the server as part of the HTTP Request. This can be done using the HEAD, GET or POST method by assigning the JSON string to a variable. It can also be sent as raw text using the POST method, but this may create extra work for you on the server-side.
  2. On the server-side:
    • Decode the incoming JSON string and convert the result to an object using a JSON parser for the language of your choice. At http://www.json.org, you'll find JSON parsers for many modern programming languages. The methods available depend upon which parser you are using. See the parser's documentation for details.
    • Do whatever you wish with the object.
    • If you wish to send JSON back to the client:
      • Create a new object for storing the response data.
      • Convert the new object to a string using your JSON parser.
      • Send the JSON string back to the client as the response body (e.g,Response.Write(strJSON)echo $strJSONout.write(strJSON)etc.).
  3. On the client-side:
    • Convert the incoming JSON string to an object using the JavaScript JSON parser.
    • Do whatever you wish with the object.
    • And so on...

comments powered by Disqus
User Profile
Toni bhalla
Team Lead at Wipro
Hydrabad , India
Email :You must Log In to access the contact details.
Latest Post from :[email protected]
XAML An Intoduction
View: 1415 | Submitted on: 8/2/2010 3:46:04 AM
JSON An Introduction Part2
View: 1490 | Submitted on: 7/28/2010 7:39:49 AM
Google Interview Questions
View: 2001 | Submitted on: 7/22/2010 1:42:10 AM
Submit Articles | All Post of This User..

All rights reserved to dotnetcodes. Logos, company names used here if any are only for reference purposes and they may be respective owner's right or trademarks.
Best viewed at 1024 x 768 resolution with Internet Explorer 5.0 or Mozila Firefox 3.5 or Google Crome and higher