Home Tutorials Json Creating Array Objects in JavaScript with JSON



Creating Array Objects in JavaScript with JSON
Posted on: September 27, 2008 at 12:00 AM
In the previous section of JavaScript-JSON tutorial you have known that how to create an object and now in this tutorial we have provided you the way array of objects are declared in JavaScript-JSON.

Creating Array Objects in JavaScript with JSON

     

In the previous section of JavaScript-JSON tutorial you have known that how to create an object and now in this tutorial we have provided you the way array of objects are declared in JavaScript-JSON.

In our example file we have created an object "students" which contains two array objects "Maths" and "Science" containing name, marks and age of two students. Now we  can access these objects value in the following way:

"students.Maths" for accessing Maths array and "students.Science" for accessing Science array object. Now to access first element of the Maths array we can write it as "students.Maths[1]" and then we can access elements of this array as "students.Maths[1].Name" for name and "students.Maths[1].Marks" for marks of the first student in Maths and so on.

Here is the full example code for JavaScript-JSONArray.htm file.


JavaScript-JSONArray.htm

<html>
<head>
<title>
Array JSON-JavaScript Example
</title>
<script language="javascript" >
var students = "Maths"      {"Name" "Amit"// First element
  "Marks" 67,
 "age" 23 },
{"Name"  "Sandeep"// Second element
 "Marks" 65,
 "age" 21 }
 ]
"Science" :  [
{
"Name"  "Shaili",  // First Element
 "Marks" 56,
 "age" 27 },  
  "Name"  "Santosh",  // Second Element
  "Marks" 78,
 "age" 41 }
 
  
  // Printing all array values 
var i=0
document.writeln("<table border='1'><tr>");
for(i=0;i<students.Maths.length;i++)
{  
  document.writeln("<td>");
  document.writeln("<table border='0'  width=100 >");
  document.writeln("<tr><td><B>Name</B></td><td width=50>"
  +students.Maths
[i].Name+"</td></tr>");
  document.writeln("<tr><td><B>Marks</B></td><td width=50>"
 
+students.Maths[i].Marks +"</td></tr>");
  document.writeln("<tr><td><B>Age</B></td><td width=50>"
  +students.Maths
[i].age +"</td></tr>");
  document.writeln("</table>");
  document.writeln("</td>");
}
for(i=0;i<students.Science.length;i++)
{
  document.writeln("<td>");
  document.writeln("<table border='0'  width=100 >");
  document.writeln("<tr><td><B>Name</B></td><td width=50>"
   +students.Science
[i].Name+"</td></tr>");
  document.writeln("<tr><td><B>Marks</B></td><td width=50>"
   +students.Science
[i].Marks +"</td></tr>");
  document.writeln("<tr><td><B>Age</B></td><td width=50>"
  
+students.Science[i].age +"</td></tr>");
  document.writeln("</table>");
  document.writeln("</td>");
}
document.writeln("</tr></table>");
</script>
</head>
<body>
Using Array of objects via JSON in JavaScript
</body>
</html>


Output:


To run this example create JavaScript-JSONArray.htm and run it on browser for output.


Download Code

     

Related Tags for Creating Array Objects in JavaScript with JSON:
javajavascriptcjsonidearrayscriptobjectioobjectsipvitutorialriathisidcreatejstoesectioninnoasjcldeclarehowobjprotorssoatkishaprerayeaandarvatutorscrssriripthavhatctsecljeprndono


More Tutorials from this section

Ask Questions?    Discuss: Creating Array Objects in JavaScript with JSON   View All Comments

Post your Comment


Your Name (*) :
Your Email :
Subject (*):
Your Comment (*):
  Reload Image
 
 

Ask Questions?

If you are facing any programming issue, such as compilation errors or not able to find the code you are looking for.

Ask your questions, our development team will try to give answers to your questions.