What's the right technique for accessing an object's data in JavaScript?

Question

I have this object:

var count = {
table: 15,
people: 34,
places_details: 85,
story_1: 21,
story_2: 6,
story_3: 11,
}

This array:

 var categories = ['table', 'people', 'places_details', 'story_1', 'story_2', 'story_3']

And this function:

function preloadThumbs()
{
var j=0;
for (j=0; j<categories.length; j++)
    {
    var k=1;
    for (k=1; k<=count[categories[j]]; k++)
        {
        $('#preload').append('<img src="graphics/thumbs/'+categories[j]+'/'+k+'.jpg" />');
        }
    }
}

...which goes through each folder by the name of categories[j] and loads all the images into a hidden <div>.
What's a way to write the data as a single object and change the corresponding function to interpret it correctly?

Answer 1

You could directly do the following:

for (var i in count) {
    var a = i; // a would be "table"
    var b = count[i]; //b would be 15.
}

Answer 2

var count = {
  table: 15,
  people: 34,
  places_details: 85,
  story_1: 21,
  story_2: 6,
  story_3: 11,
}

function preloadThumbs() {
  var preload = $("#preload");
  for (var kind in count) {
    for (var i = 1; i <= count[kind]; i++) {
      preload.append('<img src="graphics/thumbs/' + kind + '/' + i + '.jpg" />');
    }
  }
}

This is a way of storing all your data in one object. I do not know what you want a 2D-array for.