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
