Sunday 30 September 2018

JavaScript: Multi Dimensional Arrays

JavaScript doesn’t support true multi dimensional arrays like other langauges. Suppose if you want to define an array of 10X10 you need to erite your logic like below.

var arr = new Array(10);
                          
for(var i=0; i<arr.length; i++){
         arr[i] = new Array(10);
}
                          
arrays.html
<!DOCTYPE html>

<html>

<head>
    <title>Multi Dimensional Arrays</title>
</head>

<body>
    <script type="text/javascript">
        var arr = new Array(10);

        for (var i = 0; i < arr.length; i++) {
            arr[i] = new Array(10);
        }

        /* Define Array */
        for (var i = 0; i < arr.length; i++) {
            for (var j = 0; j < arr[i].length; j++) {
                arr[i][j] = (i + 1) * (j + 1);
            }
        }

        /* display Array */
        for (var i = 0; i < arr.length; i++) {
            for (var j = 0; j < arr[i].length; j++) {
                document.write(arr[i][j] + "   ");
            }
            document.write("<br />");
        }
    </script>
</body>

</html>

Open above page in browser, you can able to see following text.

1 2 3 4 5 6 7 8 9 10
2 4 6 8 10 12 14 16 18 20
3 6 9 12 15 18 21 24 27 30
4 8 12 16 20 24 28 32 36 40
5 10 15 20 25 30 35 40 45 50
6 12 18 24 30 36 42 48 54 60
7 14 21 28 35 42 49 56 63 70
8 16 24 32 40 48 56 64 72 80
9 18 27 36 45 54 63 72 81 90
10 20 30 40 50 60 70 80 90 100

Unlike other languages, it is not necessary all the columns should have same length in multi dimensional array.

var arr = new Array(10);
                          
for(var i=0; i<arr.length; i++){
         arr[i] = new Array(i+1);
}

As you see above snippet,
         arr[0] has length 1
         arr[1] has length 2
arr[2] has length 3 etc.,

arrays.html
<!DOCTYPE html>

<html>

<head>
    <title>Multi Dimensional Arrays</title>
</head>

<body>
    <script type="text/javascript">
        var arr = new Array(10);

        for (var i = 0; i < arr.length; i++) {
            arr[i] = new Array(i + 1);
        }

        var counter = 1;

        /* Define Array */
        for (var i = 0; i < arr.length; i++) {
            for (var j = 0; j < arr[i].length; j++) {
                arr[i][j] = counter++;
            }
        }

        /* display Array */
        for (var i = 0; i < arr.length; i++) {
            for (var j = 0; j < arr[i].length; j++) {
                document.write(arr[i][j] + "   ");
            }
            document.write("<br />");
        }
    </script>
</body>

</html>


Open above page in browser, you can able to see following text.

1
2 3
4 5 6
7 8 9 10
11 12 13 14 15
16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31 32 33 34 35 36
37 38 39 40 41 42 43 44 45
46 47 48 49 50 51 52 53 54 55





Previous                                                 Next                                                 Home

No comments:

Post a Comment