Home > DeveloperSection > Blogs > How to use Array object in JavaScript using JSON

How to use Array object in JavaScript using JSON


JSON JSON 
Ratings:
0 Comment(s)
 2899  View(s)
Rate this:

How to use Array object in JavaScript using JSON

In this blog I’m going to explain you how to create array object in JavaScript using JSON. Let’s see a brief demonstration on it.

 <!DOCTYPE html>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

    <title></title>

</head>

<body>

    <h1 style="color: purple;">

        Example of Creating Array Object in JavaScript using JSON</h1>

    </br>

    <script type="text/javascript">

 

        // Declaration of Array object using JSON structure and data types

        var StudentDetails = {

            //Array to collect record of Student.

            // Information of MCA students

            "MCAStudent": [{

                "StudentName": "Kumar Vishu",

                "Roll_No": 100,

                "Stream": "Computer Science",

                "Course": "MCA"

            }],

            // Information of B.Tech Students

            "BtechStudent": [

                    {

                        "StudentName": "Tarun Bindra",

                        "Roll_No": 101,

                        "Stream": "Science",

                        "Course": "B.Tech"

                    }],

            // Information of MBA Student

            "MbaStudent": [

                     {

                         "StudentName": "Arun Singh",

                         "Roll_No": 103,

                         "Stream": "Management Studies",

                         "Course": "MBA"

                     }],

            // Information of BE student

            "BeStudent": [

                     {

                         "StudentName": "Rohit Tyagi",

                         "Roll_No": 104,

                         "Stream": "Engineering",

                         "Course": "BE"

                     }],

            // Information of B.A. student

            "BaStudent":

                    [{

                        "StudentName": "Rohan Bopanna",

                        "Roll_No": 105,

                        "Stream": "Art",

                        "Course": "B.A."

                    }]

 

        }// End of  creation of Array object in JavaScript using with JSON

 

        //Print Array items or elements on web page.

        //Declare variable to count array element

        var i = 0;

        document.writeln("<table border='2' width='1000'><tr>");

        // Print MCA Student details on web page

        for (i = 0; i < StudentDetails.MCAStudent.length; i++) {

            document.writeln("<td><table><tr>");

            document.writeln("<td>")

            document.writeln("<table><tr>" + "<td><b>Student Name:</b></td>" + "<td>" + StudentDetails.MCAStudent[i].StudentName + "<td></tr>");

            document.writeln("<tr>" + "<td><b>Roll_No:</b></td>" + "<td>" + StudentDetails.MCAStudent[i].Roll_No + "<td></tr>");

            document.writeln("<tr>" + "<td><b>Stream:</b></td>" + "<td>" + StudentDetails.MCAStudent[i].Stream + "<td></tr>");

            document.writeln("<tr>" + "<td><b>Course:</b></td>" + "<td>" + StudentDetails.MCAStudent[i].Course + "<td></tr>");

            document.writeln("</td>");

            document.writeln("</tr></table></td>");

        }

        // Print B.Tech Student details

        for (i = 0; i < StudentDetails.BtechStudent.length; i++) {

            document.writeln("<td><table ><tr>");

            document.writeln("<td>")

            document.writeln("<table><tr>" + "<td><b>Student Name:</b></td>" + "<td>" + StudentDetails.BtechStudent[i].StudentName + "<td></tr>");

            document.writeln("<tr>" + "<td><b>Roll_No:</b></td>" + "<td>" + StudentDetails.BtechStudent[i].Roll_No + "<td></tr>");

            document.writeln("<tr>" + "<td><b>Stream:</b></td>" + "<td>" + StudentDetails.BtechStudent[i].Stream + "<td></tr>");

            document.writeln("<tr>" + "<td><b>Course:</b></td>" + "<td>" + StudentDetails.BtechStudent[i].Course + "<td></tr>");

            document.writeln("</td>");

            document.writeln("</tr></table></td>");

        }

        // Print MBA Student Details

        for (i = 0; i < StudentDetails.MbaStudent.lenght; i++) {

            document.writeln("<td><table><tr>");

            document.writeln("<td>")

            document.writeln("<table><tr>" + "<td><b>Student Name:</b></td>" + "<td>" + StudentDetails.MbaStudent[i].StudentName + "<td></tr>");

            document.writeln("<tr>" + "<td><b>Roll_No:</b></td>" + "<td>" + StudentDetails.MbaStudent[i].Roll_No + "<td></tr>");

            document.writeln("<tr>" + "<td><b>Stream:</b></td>" + "<td>" + StudentDetails.MbaStudent[i].Stream + "<td></tr>");

            document.writeln("<tr>" + "<td><b>Course:</b></td>" + "<td>" + StudentDetails.MbaStudent[i].Course + "<td></tr>");

            document.writeln("</td>");

            document.writeln("</tr></table></td>");

        }

        // Print BE Student Details

        for (i = 0; i < StudentDetails.BeStudent.length; i++) {

            document.writeln("<td><table><tr>");

            document.writeln("<td>")

            document.writeln("<table><tr>" + "<td><b>Student Name:</b></td>" + "<td>" + StudentDetails.BeStudent[i].StudentName + "<td></tr>");

            document.writeln("<tr>" + "<td><b>Roll_No:</b></td>" + "<td>" + StudentDetails.BeStudent[i].Roll_No + "<td></tr>");

            document.writeln("<tr>" + "<td><b>Stream:</b></td>" + "<td>" + StudentDetails.BeStudent[i].Stream + "<td></tr>");

            document.writeln("<tr>" + "<td><b>Course:</b></td>" + "<td>" + StudentDetails.BeStudent[i].Course + "<td></tr>");

            document.writeln("</td>");

            document.writeln("</tr></table></td>");

        }

        // Print BA student Details

        for (i = 0; i < StudentDetails.BaStudent.length; i++) {

            document.writeln("<td><table><tr>");

            document.writeln("<td>")

            document.writeln("<table><tr>" + "<td><b>Student Name:</b></td>" + "<td>" + StudentDetails.BaStudent[i].StudentName + "<td></tr>");

            document.writeln("<tr>" + "<td><b>Roll_No:</b></td>" + "<td>" + StudentDetails.BaStudent[i].Roll_No + "<td></tr>");

            document.writeln("<tr>" + "<td><b>Stream:</b></td>" + "<td>" + StudentDetails.BaStudent[i].Stream + "<td></tr>");

            document.writeln("<tr>" + "<td><b>Course:</b></td>" + "<td>" + StudentDetails.BaStudent[i].Course + "<td></tr>");

            document.writeln("</td>");

            document.writeln("</tr></table></td>");

        }

        document.writeln("</tr></table>");

    </script>

</body>

</html>

 

 


Don't want to miss updates? Please click the below button!

Follow MindStick