Javascript: how to create a multidimensional array? (Sample code required)

Question

I have a table of 10 rows, 10 columns. I want to define an array where I can place the value, for example. position row 5, column 3.

The value itself is an array with a large number of records. And the record of this array is also an array.

Example:

Row 1, column 1: My text 1, Link to text 1 My text 2, Link to text 2 Row 4, column 5: My text 3, Link to text 3 Row 6, column 2: My text 1, Link to text 1 My text 2, Link to text 2 My text 3, Link to text 3 My text 4, Link to text 4 

Not every table entry needs to be defined. A table item record can contain multiple records. A record consists of two values. Text and link for text.

The html table is already defined. Now I want to fill it with the values ​​(links) above.

My problem is how to create an efficient data structure so that I can easily find table positions containing records (possibly without loops of 10 rows 10 columns). For each entry I want to get a list of texts + links.

And how to access / read every entry in my definition. (I have nothing to put the value in my html table.)

I would really appreciate it if someone could give me a code example on how to set up such a data structure.

Answer 1

 var multiArray = [ ['element 0, 0', 'element 0, 1', 'element 0, 2'], ['element 1, 0', 'element 1, 1']]; 

etc.

EDIT each individual entry in [] is an array, so you just need to merge them into another array

Answer 2

Just use an array of arrays if memory is not a problem;

 var table = []; table.length = 10; // 10 rows; for (var i = 0; i < array.length; i++) { table[i] = []; table[i].length = 20; // 20 columns for each row. } 

If the table is large, but only a few cells are used, you can also use a hash hash:

 var table = {}; table.rowCount = 10; // there're 10 rows table[1] = {} table[1].columnCount = 20 // 20 cells for row 1 table[1][3] = "hello world"; // visit all cells for (var row in table) { for (var column in table[row] { console.log(table[row][column]); } } 

You can even mix hash and array.

Answer 3

You can create a simple wrapper to make the call convenient: http://jsfiddle.net/QRRXG/2/ .

A multidimensional array is just an array in another. Thus, you can build an array with 10 arrays, which, in turn, have 10 arrays each. Then get one with arr[i][j] .

Elements can be represented as an object:

 { name: "foo", link: "bar" } 

then such an element can be parsed as obj.name and obj.link .

 var multi = (function() { var data = []; // initialize for(var i = 0; i < 10; i++) { data[i] = []; for(var j = 0; j < 10; j++) { data[i][j] = []; } } return { get: function(i, j) { // will return an array of items return data[i][j]; }, push: function(i, j, v) { // will add an item data[i][j].push(v); }, clear: function(i, j) { // will remove all items data[i][j] = []; }, iterateDefined: function(f) { for(var i = 0; i < 10; i++) { for(var j = 0; j < 10; j++) { if(data[i][j].length > 0) { f(data[i][j], i, j); } } } } }; })(); 

You can use it like:

 multi.push(2, 3, { name: "foo", link: "test1" }); multi.push(2, 3, { name: "bar", link: "test2" }); multi.push(1, 4, { name: "haz", link: "test3" }); multi.push(5, 7, { name: "baz", link: "test4" }); multi.clear(5, 7); console.log(multi.get(2, 3)); // logs an array of 2 items console.log(multi.get(1, 4)); // logs an array of 1 item console.log(multi.get(5, 7)); // logs an array of 0 items console.log(multi.get(2, 3)[0].name); // logs "foo" console.log(multi.get(2, 3)[1].link); // logs "test2" multi.iterateDefined(function(items, i, j) { console.log(items, i, j); // will log two times }); 

Answer 4

Create the Object utility:

 var DataTable = { source: [], setEntry: function(i,j,e) { var o ; if( !!! ( o = this.source[i] ) ) o = this.source[i] = [] ; o[j] = e ; return this ; }, getEntry: function(i,j) { var o, e = null ; if( !! ( o = this.source[i] ) ) e = o[j] || null ; return e ; } } ; 

Other answers seem to suggest placing dummy Array as placeholders for unused coordinates. This - while this is wrong - is not necessary: ​​if you set an entry in Array in JavaScript whose index exceeds the current range, Array is essentially padded with undefined values.

 var a = [ ] ; // a length is 0 a[1024] = 1 // a length is now 1025, a[1] is undefined 

Then add the desired values:

 DataTable.setEntry( 1, 1, ["My text 1","Link to text 1","My text 2","Link to text 2"] ) .setEntry( 4, 5, ["My text 3","Link to text 3"] ) //.. ; 

The following control statements will return Array coordinates or null (if the DataTable.source does not contain nested Array for the given coordinates):

 console.log("(!!) d.source: " + DataTable.getEntry(4,5) ) ; console.log("(!!) d.source: " + DataTable.getEntry(1,1) ) ; console.log("(!!) d.source: " + DataTable.getEntry(0,0) ) ; 

---

Try it here:

• JSFiddle reference

NTN

FC