Published on

Json description

Published in: Technology
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide


  1. 1. JSON JavaScript Object Notation Developed by: Musavir Iftikhar Jan 2007
  2. 2. Introduction <ul><li>A lightweight data-interchange format. </li></ul><ul><li>Easy for humans to read and write. </li></ul><ul><li>Alternative solution of XML </li></ul><ul><li>A text format that is completely language independent </li></ul><ul><li>Uses convention like C and Java </li></ul><ul><li>It is JavaScript based Language </li></ul>
  3. 3. JSON values <ul><li>A collection of name/value pairs. In various languages, this is realized as an object , record, struct, dictionary, hash table, keyed list, or associative array </li></ul><ul><li>An ordered list of values. In most languages, this is realized as an array , vector, list, or sequence. </li></ul>
  4. 4. Data types in JavaScript <ul><li>Primitive data types are as followings </li></ul><ul><li>Undefined </li></ul><ul><li>Null </li></ul><ul><li>Boolean </li></ul><ul><li>Number and String . </li></ul><ul><li><script> int a = 5; </li></ul><ul><li>Alert (typeof a) // will show int </li></ul><ul><li></script> </li></ul>
  5. 5. Built-in Objects in JavaScript <ul><li>Built-in JavaScript objects </li></ul><ul><li>Image, array and object </li></ul><ul><li>Following is an instance of image built-in javascript object </li></ul><ul><li><script> </li></ul><ul><li>var Image1 = new Image(); </li></ul><ul><li>Image1.src = “bird. gif &quot;; </li></ul><ul><li></script> </li></ul>
  6. 6. New Object in JavaScript <ul><li>A function in JavaScript is an Object </li></ul><ul><li><script> </li></ul><ul><li>function myFunc(){ } var myObject = new myFunc(); alert(typeof myObject);  // displays &quot;object“ </li></ul><ul><li></script> </li></ul>
  7. 7. Constructor of object <ul><li>A constructor is the default value of function </li></ul><ul><li><script> </li></ul><ul><li>function myFunc(){  return 5; } var myObject = myFunc(); alert(typeof myObject); // displays &quot;number“ </li></ul><ul><li></script> </li></ul>
  8. 8. Object function more <ul><li>Function with default value </li></ul><ul><li><script> </li></ul><ul><li>function myFunc(){  this.StringValue = &quot;This is a String&quot;; } var myObject = new myFunc(); var myObject2 = new myFunc(); alert(myObject2.StringValue); // displays &quot;This is a String“ </li></ul><ul><li></script> </li></ul>
  9. 9. Passing values to Objects <ul><li>Function that takes Object’s value </li></ul><ul><li><script> </li></ul><ul><li>function myFunc(StringValue){  this.StringValue = StringValue; } var myObject = new myFunc(&quot;This is myObject's string&quot;); var myObject2 = new myFunc(&quot;This is a String&quot;); alert(myObject.StringValue); // displays &quot;This is myObject's string&quot; alert(myObject2.StringValue); // displays &quot;This is a String“ </li></ul><ul><li></script> </li></ul>
  10. 10. Object with methods <ul><li>A Object with functions is a function that uses other functions for its functionality. </li></ul><ul><li><script> </li></ul><ul><li>function Circle(radius){  this.radius = radius;  this.getArea = getArea;  this.getCircumference = getCircumference; } </li></ul><ul><li>function getArea(){ </li></ul><ul><li>return (this.radius*this.radius*3.14); </li></ul><ul><li>} </li></ul><ul><li>function getCircumference(){ </li></ul><ul><li>var diameter = this.radius*2; </li></ul><ul><li>var circumference = diameter*3.14; </li></ul><ul><li>return circumference; </li></ul><ul><li>} </li></ul>
  11. 11. Code.. continue <ul><li>var bigCircle = new Circle(100); </li></ul><ul><li>var smallCircle = new Circle(2); </li></ul><ul><li>alert(bigCircle.getArea()); // displays 31400 </li></ul><ul><li>alert(bigCircle.getCircumference()); // displays 618 </li></ul><ul><li>alert(smallCircle.getArea()); // displays 12.56 </li></ul><ul><li>alert(smallCircle.getCircumference()); // displays 12.56 </li></ul><ul><li></script> </li></ul><ul><li>Note: this key world always point to the variable of that object that is </li></ul><ul><li>instantiated. </li></ul><ul><li>The functions that Object using refer to the variable of Object function </li></ul><ul><li>when they </li></ul><ul><li>Come across this keyword as this.radius means the radius of the Object </li></ul><ul><li>function Circle. </li></ul>
  12. 12. Inner or Nested functions <ul><li>Inner Function is created inside the function for Objected Oriented programming style. It is clear and easy to write. </li></ul><ul><li>Note: the constructor function argument variable must be accessed by using key world this </li></ul><ul><li><script> </li></ul><ul><li>function Circle(radius){  this.radius = radius;  this.getArea = function(){    return (this.radius*this.radius*3.14);  }  this.getCircumference = function(){    var diameter = this.radius*2;    var circumference = diameter*3.14;    return circumference;  } } </li></ul>
  13. 13. Code…continue <ul><li>var bigCircle = new Circle(100); var smallCircle = new Circle(2); alert(bigCircle.getArea()); // displays 31400 alert(smallCircle.getCircumference()); // displays 12.56 </li></ul><ul><li></script> </li></ul>
  14. 14. JSON Object <ul><li>object </li></ul><ul><ul><li>{} </li></ul></ul><ul><ul><li>{ members } </li></ul></ul><ul><li>members </li></ul><ul><ul><li>pair </li></ul></ul><ul><ul><li>pair , members </li></ul></ul><ul><li>pair </li></ul><ul><ul><li>string : value </li></ul></ul><ul><li>array </li></ul><ul><ul><li>[] [ elements ] </li></ul></ul><ul><li>elements </li></ul><ul><ul><li>value value , elements </li></ul></ul>
  15. 15. JSON Object <ul><li>value </li></ul><ul><ul><li>string number object array true false null </li></ul></ul><ul><li>string </li></ul><ul><ul><li>&quot;&quot; &quot; chars &quot; </li></ul></ul><ul><li>chars </li></ul><ul><ul><li>char char chars </li></ul></ul>
  16. 16. JSON Object <ul><li>char </li></ul><ul><ul><li>any-Unicode-character-      except- &quot; -or- -or-      control-character &quot; /  f u four-hex-digits </li></ul></ul><ul><li>number </li></ul><ul><ul><li>int int frac int exp int frac exp </li></ul></ul>
  17. 17. JSON Object <ul><li>int </li></ul><ul><ul><li>digit digit1-9 digits - digit - digit1-9 digits </li></ul></ul><ul><li>frac </li></ul><ul><ul><li>. digits </li></ul></ul><ul><li>exp </li></ul><ul><ul><li>e digits </li></ul></ul><ul><li>digits </li></ul><ul><ul><li>digit digit digits </li></ul></ul><ul><li>e </li></ul><ul><ul><li>e e+ e- E E+ E- </li></ul></ul>
  18. 18. Using JSON <ul><li>JSON is available for two sides </li></ul><ul><li>Server side JSON </li></ul><ul><li>Format is written in the server specific language as C, C++, C#, java, PHP etc. </li></ul><ul><li>It is used to decode the client request </li></ul><ul><li>Client side JSON </li></ul><ul><li>JavaScript is used to encode the JSON response to convert it into text representation of receiving Object </li></ul>
  19. 19. Server side Requirements <ul><li>Need JSON file written in support server side language as for PHP JSON.php </li></ul><ul><li>Include into page and create a new instance </li></ul><ul><li><?php </li></ul><ul><li>require_once &quot;JSON.php&quot;; </li></ul><ul><li>//create a new instance of Services_JSON </li></ul><ul><li>$json = new Services_JSON(); </li></ul><ul><li>?> </li></ul>