Latest Tutorials| Questions and Answers|Ask Questions?|Site Map



Home Tutorials Json Creating Array Objects in JavaScript with JSON

Related Tutorials


 
 

Share on Google+Share on Google+

Creating Array Objects in JavaScript with JSON

Advertisement
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

     

Advertisements

If you enjoyed this post then why not add us on Google+? Add us to your Circles



Liked it!  Share this Tutorial


Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.

Posted on: September 27, 2008

Related Tutorials

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

Post your Comment


Your Name (*) :
Your Email :
Subject (*):
Your Comment (*):
  Reload Image
 
 
Comments:12
vibhav
May 29, 2011
wrong code

one "{" is missing before science santosh.
shock
July 8, 2011
error.

"Name" : "Santosh", // Second Element the opening curly "{" bracket is missing in the bbove line of code
Chaitanya
August 27, 2011
Doesn't work

Yeah this example doesn't seem to work. You missed a '{' before the name "Santosh" in the "Science" part earlier.
avinash
January 21, 2012
error

{"Name" : "Sandeep", // Second element "Marks" : 65, "age" : 21 } ], "Science" : [ {"Name" : "Shaili", // First Element "Marks" : 56, "age" : 27 }, "Name" : "Santosh", // Second Element//error:in this line before "Name" there is "{" bracket missing "Marks" : 78, "age" : 41 } ] }
Karthick moorthy
March 29, 2012
'{' missing in creating the object

In science array when declaring the second student name, to create the object '{' is needed. It's missing there. So it will not produce appropriate result... It should be like.... "Science" : [ {"Name" : "Shaili", // First Element "Marks" : 56, "age" : 27 }, { "Name" : "Santosh", // Second Element "Marks" : 78, "age" : 41 } ]
Rajat Sharma
May 8, 2012
Error in code

Please replace "Name" : "Santosh", // Second Element with {"Name" : "Santosh", // Second Element "{" is missing.
nishant pandey
June 22, 2012
Thankyou!

I really appreciate your effort. Its quiet easy to understand.
Rajesh
June 26, 2012
Review abt above code

Hi, Nice code,easily understandable one.... Thank u for posting that great code......
Ramnath
September 6, 2012
Correction

It would be apt if the objectName "student" is replaced with "Exam" and "name" with "StudentName".
DMCA.com