How do I create a Multidimensional Array in Javascript?

Question

My goal is to iterate over a table with an ID of ajaxResponse1 and store each COLUMN'S values in a separate array. Each of the entries in valuesArr will be a column containing an array of individual values.

I tried using new Array instead of new Object, but I still don't seem to be getting any output alerted to my screen. Should I be using some combination of .push to get each new column value into the appropriate array? Hope that's clear. Any ideas? Thanks!

var valuesArr = new Object();

$('#ajaxResponse1 tr').each( function() {
    var colNum = 0;
    $('th, td', this).each( function() {
        valuesArr[colNum] = valuesArr[colNum].push( $(this).html() );   
        colNum++;
    });
});

alert(JSON.stringify(valuesArr));

[This question](http://stackoverflow.com/q/2808926/901048) might help you. — Blazemonger, May 04 '12 at 16:49
Try putting your alert inside the loop so you can check what's going into the array — mafue, May 04 '12 at 16:51
_not_ a duplicate IMHO, since this has the added complication of creating the _transpose_ of the original table. — Alnitak, May 04 '12 at 17:13

Alnitak · Accepted Answer · 2012-05-04T17:03:52.803

2

You can't push something onto an array until that array actually exists.

So in each iteration of your inner loop, if the initial array doesn't exist you have to create it:

var valuesArr = [];

$('#ajaxResponse1 tr').each( function() {
    $('th, td', this).each( function(i, el) { // nb: implicit column number
        var html = $(this).html();
        if (i in valuesArr) {
            valuesArr[i].push(html);
        } else {
            valuesArr[i] = [ html ];  // new array with one element
        }
    }
});

edited May 04 '12 at 17:03

answered May 04 '12 at 16:54

Alnitak

334,560
70
407
495

Worked like a charm. I NEVER would have guessed that was the issue. Thanks for the help! – Andrew May 04 '12 at 17:03
1

@Anjroo see updated code example which eliminates the `colNum` variable – Alnitak May 04 '12 at 17:04

Samuel Hapak · Answer 2 · 2012-05-04T17:03:35.550

1

The push() method adds new items to the end of an array, and returns the new length. So, try to change it:

valuesArr[colNum].push( $(this).html() );

Just remove the =

Moreover, you need to initialize array before first time using it, try:

valuesArr[colNum] = valuesArr[colNum] ? valuesArr[colNum] : [];

You will find complete working example here http://jsfiddle.net/57A9z/

edited May 04 '12 at 17:03

answered May 04 '12 at 16:52

Samuel Hapak

6,950
3
35
58

mihai · Answer 3 · 2012-05-04T16:59:53.170

0

var valuesArr = [];
var r = 0;
var c = 0;

$('#ajaxResponse1 tr').each( function() {
    valuesArr[r] = [];
    $('th, td', this).each( function() {
        valuesArr[r][c] = $(this).html();   
        c++;
    });
    c = 0;
    r++;
});

edited May 04 '12 at 16:59

answered May 04 '12 at 16:52

mihai

37,072
9
60
86

You're creating an entry for each row, not one for each column. – Alnitak May 04 '12 at 17:27
yep, I misunderstood the question. Looking at the code I thought it made more sense this way, but it seems like the requirements were different. cheers :) – mihai May 05 '12 at 12:08

score 0 · Answer 4 · edited Jul 21 '22 at 13:51

Multidimensional array = embeded arrays. See if this tiny model can help. thanks.

   "use strict";
   const arr = [
       ["D1","D2","D3"],
       [
           ["T11","T12","T13"],
           ["T21","T22","T23"]
       ]
   ];

   for(let k=0;k<arr[0].length;k++)
      console.log(arr[0][k]);
      // D1
      // D2
      // D3

   for(let k=0;k<arr[1].length;k++)
      console.log(arr[1][k]);
      // Array(3) [ "T11", "T12", "T13" ]
      // Array(3) [ "T21", "T22", "T23" ]

   for(let k=0;k<arr[1].length;k++)
      console.log(arr[1][0][k]);
      // T11
      // T12

   for(let k=0;k<arr[1].length;k++)
      console.log(arr[1][1][k]);
      // T21
      // T22

How do I create a Multidimensional Array in Javascript?

4 Answers4