Splitting and recombining data in arrays

[Tuxedo]

Hi,

What convention may be good for creating multi-dimensional arrays, or
simulating them in Javascript?

To display for example a series of images with captions, image sources in
one array and captions in another, a typical method may be pairing up
arrays and writing them out together, along the following:

var images = ["0001.jpg", "0002.jpg", "0003.jpg", "0004.jpg", "0005.jpg",
"0006.jpg"]

var captions = ["Caption 1", "Caption 2", "Caption 3", "Caption 4",
"Caption 5", "Caption 6"]

for(var i = 0; i <images.length; i++)
document.write("<img src="+images+"><br>"+captions+"<br>");

This works fine if the contents of the arrays do not need to be changed
very often or if the arrays are not very long, but as soon one is dealing
with longer arrays that requires frequent change, it naturally becomes
altogether harder to keep track of pairs and more prone to error.

Preferably I'd like to use only one array, with some kind of delimiter like
a vertical bar or likewise, for example:

var gallary = ["0001.jpg | Caption 1",
"0002.jpg | Caption 2",
"0003.jpg | Caption 3",
"0004.jpg | Caption 4",
"0005.jpg | Caption 5",
"0006.jpg | Caption 6"]

Thereafter somehow divide the above into separate arrays and stitch them
together with a regular loop. I guess this is the way its normally done?

Of course, this would not only be good for images/captions but also for any
other situations where the data would otherwise need to be combined and
written out from two or more arrays. I guess this is not a too complicated
question which may have been answered many times before. However, if anyone
has some sane examples of how it could be best be done, it would be greatly
appreciated.

Many thanks,
Tuxedo

 

[Martin Honnen]

Preferably I'd like to use only one array, with some kind of delimiter like
a vertical bar or likewise, for example:

var gallary = ["0001.jpg | Caption 1",
"0002.jpg | Caption 2",
"0003.jpg | Caption 3",
"0004.jpg | Caption 4",
"0005.jpg | Caption 5",
"0006.jpg | Caption 6"]

Thereafter somehow divide the above into separate arrays and stitch them
together with a regular loop. I guess this is the way its normally done?

What is wrong with an array of objects e.g.
var gallery = [
{ img: '0001.jpg', caption: 'Caption 1' },
{ img: '0002.jpg', caption: 'Caption 2' },
{ img: '0003.jpg', caption: 'Caption 3' },
{ img: '0004.jpg', caption: 'Caption 4' },
{ img: '0005.jpg', caption: 'Caption 5' },
{ img: '0006.jpg', caption: 'Caption 6' }
];
Then you can access e.g.
gallery[0].img
and
gallery[0].caption

 

[Tuxedo]

Martin Honnen wrote:

[...]

What is wrong with an array of objects e.g.
var gallery = [
{ img: '0001.jpg', caption: 'Caption 1' },
{ img: '0002.jpg', caption: 'Caption 2' },
{ img: '0003.jpg', caption: 'Caption 3' },
{ img: '0004.jpg', caption: 'Caption 4' },
{ img: '0005.jpg', caption: 'Caption 5' },
{ img: '0006.jpg', caption: 'Caption 6' }
];
Then you can access e.g.
gallery[0].img
and
gallery[0].caption

Nothing wrong with that, I just didn't know better, but
the above should work just perfectly.

Thanks,
Tuxedo

 

[Dr J R Stockton]

What convention may be good for creating multi-dimensional arrays, or
simulating them in Javascript?

Martin Honnen has given you what you need, without answering your
question above.

Evidently you understand one-dimensional arrays, and addressing their
elements as Arr[J] If each of those elements is a 1-D array, then you
have in effect a two dimensional array, and can address elements as
(Arr[J])[K] or Arr[J][K] rather than A[J, K} as in some other languages.

The subsidiary arrays do not need to be of equal lengths.

The argument can be repeated, so that below A is in effect a 20-D array
and Z is its deepest element.

A = [[[[[[[[[[[[[[[[[[[[77]]]]]]]]]]]]]]]]]]]]
Z = A[0][0][0][0][0][0][0][0][0][0][0][0][0][0][0][0][0][0][0][0]

There is little use for an array dimension of length smaller than 2, so
that test suggests that one will run out of element storage space rather
than depth.

 

[Tuxedo]

What convention may be good for creating multi-dimensional arrays, or
simulating them in Javascript?

Martin Honnen has given you what you need, without answering your
question above.

Evidently you understand one-dimensional arrays, and addressing their
elements as Arr[J] If each of those elements is a 1-D array, then you
have in effect a two dimensional array, and can address elements as
(Arr[J])[K] or Arr[J][K] rather than A[J, K} as in some other languages.

The subsidiary arrays do not need to be of equal lengths.

The argument can be repeated, so that below A is in effect a 20-D array
and Z is its deepest element.

A = [[[[[[[[[[[[[[[[[[[[77]]]]]]]]]]]]]]]]]]]]
Z = A[0][0][0][0][0][0][0][0][0][0][0][0][0][0][0][0][0][0][0][0]

There is little use for an array dimension of length smaller than 2, so
that test suggests that one will run out of element storage space rather
than depth.

Not quite sure how to make practical use of this, but thanks for explaining
how to create or simulate multidimensional JS arrays.

Tuxedo