JSON Array Object Program

INTRODUCTION

A JSON Array is an ordered sequence of values. Its external text form is a string wrapped in square brackets with commas separating the values. A JSON Object is an unordered collection of name/value pairs.

Simple Array Objects Syntax

JSON objects can be created with JavaScript.

Let us see the various ways of creating JSON objects using JavaScript.

  • Creation of an empty Object
    var JSONOb = {};
  • Creation of a new Object
    var JSONOb = new Object();

  • Creation of an object with attribute bookname with value in string, attribute price with numeric value. Attribute is accessed by using '.' Operator,
    var JSONObj = {"bookname":"VB BLACK BOOK", "price":500};

Example for JSON Array Object run in HTML

  1. <html>    
  2.    <head>    
  3.       <title>Creation of array object in javascript using JSON</title>    
  4.             
  5.       <script language = "javascript" >    
  6.     
  7.          document.writeln("<h2>JSON array object</h2>");    
  8.     
  9.          var books = { "Java" : [     
  10.             { "Name"  : "Core Java""price" : 600 },    
  11.             { "Name"  : "Guide to Java""price" : 400 }],      
  12.                     
  13.             "JSP"  : [    
  14.                { "Name"  : "Basics of JSP""price" : 1000 },     
  15.                { "Name"  : "Tutorial of JSP""price" : 1300 }]        
  16.          }        
  17.     
  18.          var i = 0    
  19.          document.writeln("<table border = '2'><tr>");    
  20.                 
  21.          for(i = 0;i<books.Java.length;i++){     
  22.             document.writeln("<td>");    
  23.             document.writeln("<table border = '1' width = 100 >");    
  24.             document.writeln("<tr><td><b>Name</b></td><td width = 50>" + books.Java[i].Name+"</td></tr>");    
  25.             document.writeln("<tr><td><b>Price</b></td><td width = 50>" + books.Java[i].price +"</td></tr>");    
  26.             document.writeln("</table>");    
  27.             document.writeln("</td>");    
  28.          }    
  29.     
  30.          for(i = 0;i<books.JSP.length;i++){    
  31.             document.writeln("<td>");    
  32.             document.writeln("<table border = '1' width = 100 >");    
  33.             document.writeln("<tr><td><b>Name</b></td><td width = 50>" + books.JSP[i].Name+"</td></tr>");    
  34.             document.writeln("<tr><td><b>Price</b></td><td width = 50>" + books.JSP[i].price+"</td></tr>");    
  35.             document.writeln("</table>");    
  36.             document.writeln("</td>");    
  37.          }    
  38.                 
  39.          document.writeln("</tr></table>");    
  40.     
  41.       </script>    
  42.     
  43.    </head>    
  44.         
  45.    <body>    
  46.    </body>    
  47.         
  48. </html>    
Output
 


Result

Thus, we have successfully learned the JSON Array object creation program.