Dynamic Associative Array Creation in Javascript from JSON

Question

It sounds a lot more complicated than it really is.

So in Perl, you can do something like this:

foreach my $var (@vars) {
  $hash_table{$var->{'id'}} = $var->{'data'};
}

I have a JSON object and I want to do the same thing, but with a javascript associative array in jQuery.

I've tried the following:

hash_table = new Array();

$.each(data.results), function(name, result) {
  hash_table[result.(name).extra_info.a] = result.(name).some_dataset;
});

Where data is a JSON object gotten from a $.getJSON call. It looks more or less like this (my JSON syntax may be a little off, sorry):

{
  results:{
    datasets_a:{
      dataset_one:{
        data:{
          //stuff
        }
        extra_info:{
          //stuff
        }
      }
      dataset_two:{
         ...
      }
      ...
    }
    datasets_b:{
      ...
    }
  }
}

But every time I do this, firebug throws the following error:

"XML filter is applied to non-xml data"

Answer 1

Why would you want to change an array into another array ?-)

-- why not simply access the data, if you want to simplify or filter, you can traverse the arrays of the object directly !-)

Answer 2

This works. Just dump it into a script block to test.

d = {
  'results':{
   'datasets_a':{
      'dataset_one':{
        'data':{
          'sample':'hello'
        },
        'extra_info':{
          //stuff
        }
      },
  'dataset_two':{
        ///
      }
      ///
},
    'datasets_b':{
     ///
    }
  }

} alert(d.results.datasets_a.dataset_one.data.sample)

I hope this pasted in correctly. This editor doesn't like my line breaks in code.

d = { 'results':{ 'datasets_a':{ 'dataset_one':{ 'data':{ 'sample':'hello' }, 'extra_info':{ //stuff } }, 'dataset_two':{ /// } /// }, 'datasets_b':{ /// } } };

alert(d.results.datasets_a.dataset_one.data.sample)

Answer 3

Unless I'm mistaken, I thought you could use the JSON response as an associative array. So you should be able to go directly in and use the JSON.

Assuming you received the above example:

$('result').innerHTML = data['results']['dataset_a']['dataset_two']['data'];
// Or the shorter form:
$('result').innerHTML = data.results.dataset_a.dataset_two.data;

Understand that I haven't tested this, but it's safer to use the square brackets with a variable than it is to use parenthesis plus the name with the dot accessor.

Your example is failing because of some convoluted logic I just caught.

$.each(data.results), function(name, result) {
  hash_table[result.(name).extra_info.a] = result.(name).some_dataset;
});

Now, the foreach loop goes through the variable data.results to find the internal elements at a depth of 1. The item it finds is given to the lambda with the key of the item. AKA, the first result will be name = "datasets_a" item = object. Following me so far? Now you access the returned hash, the object in item, as though it has the child key in name ... "datasets_a". But wait, this is the object!

Also, I am ignorant of jQuery's methodry but I think the default javascript, and other libraries, use the function(item, key) {} format in the lambda for .each. So this is probably hanging you out to dry too.

Try:

$.each(data.results), function(result, name) {
  hash_table[result.extra_info.a] = result.some_dataset;
}); // if you aren't going to use it, why not remove "name"?

If all else fails... write your result JSON into a text field dynamically and ensure it is formatted properly.

Please don't down-vote if my answer is wrong due to ignorance of jQuery, just comment and I'll revise my answer.

Answer 4

Hmm the more I think about it the more I think I'm making it harder than it needs to be...