Getting Started with JSON

Json:javascript Object Notation (JAvaScriptObjectNotation).

JSON is the syntax for storing and exchanging textual information. Similar to XML.

JSON is smaller, faster, and easier to parse than XML.

Example used in the back

{"Employees": [{"FirstName": "Bill", "LastName": "Gates"},{"FirstName": "George", "LastName": "Bush"},{"FirstName": " Thomas "," LastName ":" Carter "}]}

This employee object is an array that contains 3 employee records (objects).

What is JSON?

• JSON refers to the JavaScript object notation (JAvaScript Object Notation)
• JSON is a lightweight text data interchange Format
• JSON independent of Language *
• JSON is self-descriptive and easier to understand

* JSON uses JAVASCRIPT syntax to describe data objects, but JSON is still independent of language and platform. The JSON parser and the JSON library support many different programming languages.

JSON-Convert to JavaScript object

The JSON text format is syntactically identical to the code that creates the JavaScript object.

Because of this similarity, the JavaScript program can use the built-in eval () function to generate native JavaScript objects with JSON data without a parser.

Like XML
 
 

  
  
 
   
JSON is plain text
 
   
JSON has a "self-descriptive" (Human readable)
 
   
JSON has a hierarchy (values exist in values)
 
   
JSON can be parsed with JavaScript
 
   
JSON data can be transmitted using AJAX
 
  
 
 
Compared to the difference between XML
 
 

  
  
 
   
No end tag
 
   
Even shorter
 
   
Read and write faster
 
   
Ability to parse using the built-in JavaScript eval () method
 
   
Working with arrays
 
   
Do not use reserved words
 
  
 
 
Why use JSON?
For AJAX applications, JSON is faster and easier to use than XML:
Using XML
 
 

  
  
 
   
Reading an XML document
 
   
Using the XML DOM to iterate through a document
 
   
Read the value and store it in a variable
 
  
 
 
Using JSON
 
 

  
  
 
   
Reading JSON strings
 
   
Working with the JSON string with eval ()
 
  
 
 
JSON syntax is a subset of JavaScript syntax.
JSON Syntax rules
JSON syntax is a subset of the JavaScript object notation syntax.

 
 

  
  
 
   
Data in name/value pairs
 
   
Data is separated by commas
 
   
Curly braces Save Object
 
   
Square brackets Save Array
 
  
 
 
JSON Name/value pairs
The writing format for JSON data is: name/value pairs.
Name/value pairs include the field name (in double quotation marks), followed by a colon, and then the value:
"FirstName": "John"
This is easy to understand and is equivalent to this JAVASCRIPT statement:
FirstName = "John"
JSON value
The JSON value can be:

 
 

  
  
 
   
Number (integer or floating point)
 
   
String (in double quotes)
 
   
Logical value (TRUE or FALSE)
 
   
Array (in square brackets)
 
   
Object (in curly braces)
 
   
Null
 
  
 
 
JSON Object
The JSON object is written in curly braces:
An object can contain multiple name/value pairs:
{"FirstName": "John", "LastName": "Doe"}
This is also easy to understand, and is equivalent to this JAVASCRIPT statement:
FirstName = "John" lastName = "Doe"
JSON Array
The JSON array is written in square brackets:
An array can contain multiple objects:
{"Employees": [{"FirstName": "John", "LastName": "Doe"},{"FirstName": "Anna", "LastName": "Smith"},{"FirstName": " Peter "," LastName ":" Jones "}]}
In the example above, the object "Employees" is an array that contains three objects. Each object represents a record of a person (with a first and last name).
JSON uses JavaScript syntax
Because JSON uses JavaScript syntax, there is no need for additional software to handle JSON in JavaScript.
With JavaScript, you can create an array of objects and assign values like this:
Example
var employees = [{"FirstName": "Bill", "LastName": "Gates"},{"FirstName": "George", "LastName": "Bush"},{"FirstName": "T Homas "," LastName ":" Carter "}];
You can access the first item in an array of JavaScript objects like this:
Employees[0].lastname;
The returned content is:
Gates
You can modify the data like this:
Employees[0].lastname = "Jobs";
In the following sections, you will learn how to convert JSON text to JavaScript objects.
JSON file
 
 

  
  
 
   
The file type of the JSON file is ". JSON"
 
   
The MIME type of JSON text is "Application/json"
 
  
 
 
Convert JSON text to JavaScript object
One of the most common uses of JSON is to read the JSON data (as a file or as a HttpRequest) from the Web server, convert the JSON data to a JavaScript object, and then use that data in the Web page.
To make it easier for you to explain, we use strings as input for demonstrations (not files).
JSON instance-an object from a string
Create a JavaScript string that contains the JSON syntax:
var txt = ' {' Employees ': [' + ' {' firstName ': ' Bill ', ' lastName ': ' Gates '}, ' + ' {' firstName ': ' George ', ' lastName ': ' Bush ' }, ' + ' {"FirstName": "Thomas", "LastName": "Carter"}]} ';
Because JSON syntax is a subset of JavaScript syntax, the JavaScript function eval () can be used to convert JSON text to JavaScript objects.
The eval () function uses the JavaScript compiler to parse the JSON text and then generate the JavaScript object. You must enclose the text in parentheses in order to avoid syntax errors:
var obj = eval ("(" + txt + ")");
To use JavaScript objects in a Web page:
Example
<p>first Name: <span id= "fname" ></span><br/>last Name: <span id= "lname" ></span> <BR/></p><script type= "Text/javascript" >document.getelementbyid ("FName"). InnerHTML = Obj.employees[1].firstnamedocument.getelementbyid ("LName"). InnerHTML = obj.employees[1].lastname</script>

JSON Parser
tip:the eval () function compiles and executes any JavaScript code. This hides a potential security issue.
Using the JSON parser to convert JSON to JavaScript objects is a safer practice. The JSON parser only recognizes JSON text and does not compile the script.
In the browser, this provides native JSON support, and the JSON parser is faster.
Native JSON support is included in newer browsers and the latest ECMAScript (JavaScript) standards.

 
 
 
  
  
 
   
 
    
Web Browser Support
 
    
Web Software Support
 
   
 
   
 
    
 
     
 
      
Firefox (Mozilla) 3.5
 
      
Internet Explorer 8
 
      
Chrome
 
      
Opera 10
 
      
Safari 4
 
     
 
    
 
     
 
      
Jquery
 
      
Yahoo UI
 
      
Prototype
 
      
Dojo
 
      
ECMAScript 1.5
 
     
 
   
 
  
 
 
 
 
Copyright NOTICE: Welcome reprint, Hope in your reprint at the same time, add the original address, thank you with
 
Getting Started with JSON