How can I dynamically name an array in Javascript?

Question

I am using jQuery and JSON to pull data from a database. Each row of the database is a different product and each product has a number of properties associated with it.

What I'm trying to do in js, is create a named array for each product containing all of the products properties. I know how to pull the data from JSON. I know how to construct the Array.

What I don't know is how to create an array name dynamically. Can someone help me out?

I am trying to name the array based on a field in the database. In the structure of my existing and working script, it's referenced as data.cssid. I'd like to use the value of data.cssid as the name of the array and then populate the array.

$.getJSON("products.php",function(data){
    $.each(data.products, function(i,data){
        var data.cssid = new Array();
        data.cssid[0] = data.productid;
        ...
        etc
    });
});

I know the code above is completely wrong, but it illustrates the idea. Where I declare "var data.cssid", I want to use the actual value of data.cssid as the name of the new array.

EDIT:

I've tried the methods mentioned here (except for eval). The code is below and is not really that different than my original post, except that I'm using a Object constructor.

$(document).ready(function(){
$.getJSON("productscript.php",function(data){
    $.each(data.products, function(i,data){
        var arrayName = data.cssid;
        obj[arrayName] = new Array();
        obj[arrayName][0] = data.productid;
        obj[arrayName][1] = data.productname;
        obj[arrayName][2] = data.cssid;
        obj[arrayName][3] = data.benefits;
        alert(obj[arrayName]); //WORKS
        alert(obj.shoe); //WORKS WHEN arrayName = shoe, otherwise undefined
    });
});
});

The alert for the non-specific obj[arrayName] works and shows the arrays in all their magnificence. But, when I try to access a specific array by name alert(obj.shoe), it works only when the arrayName = shoe. Next iteration it fails and it can't be accessed outside of this function.

I hope this helps clarify the problem and how to solve it. I really appreciate all of the input and am trying everything you guys suggest.

PROGRESS (THE SOLUTION):

$(document).ready(function(){
$.getJSON("productscript.php",function(data){
    $.each(data.products, function(i,data){
        var arrayName = data.cssid;
        window[arrayName] = new Array();
        var arr = window[data.cssid];
        arr[0] = data.productid;
        arr[1] = data.productname;
        arr[2] = data.cssid;
        arr[3] = data.benefits;
        alert(window[arrayName]); //WORKS
        alert(arrayName); //WORKS
        alert(shoe); //WORKS

    });
});
});
function showAlert() {
    alert(shoe); //WORKS when activated by button click
}

Thanks to everybody for your input.

Answer 1

No not possible. PHP has "variable variables"; Javascript does not.

You could however assign the array to an extant object :

var obj = {};
var name = 'foo';
obj[name] = 1;

alert(obj.foo) // alerts "1"

Honestly not sure why you'd need that capability anyway. Can you post more code? There's probably a decent workaround if the above doesn't help.

Answer 2

do you still want the array to be on the data object?

data[data.cssid] = new Array();

otherwise, you can assign it to any other object. assigning it to the window object, will make it globally available

window[data.cssid] = new Array();

... then if the value of data.cssid is "abc" then you can access it like so

abc[0] = data.productid;

Answer 3

You can set a property on an object by name like this:

var obj = {};  //Or, new Object()
obj[data.cssid] = new Array();

However, if you're just making a local variable, there is no point; you can simply name the array newData (or something like that), as you will only ever be dealing with a single array at a time.