Call Array Dynamically in a function

Question

I have a map of the US with all 50 states as clickable buttons, when the user clicks a state I want to display information about that state, calling on that state's array dynamically. Below is my own weak attempt that obviously does not work.

var stateList = new Array("AK","AL","AR","AZ","CA","CO","CT","DC","DC2","DE","FL","GA","GU","HI","IA","ID",
 "IL","IN","KS","KY","LA","MA","MD","ME","MH","MI","MN","MO","MS","MT","NC","ND","NE","NH","NJ","NM","NV","NY",
 "OH","OK","OR","PA","PR","RI","SC","SD","TN","TX","UT","VA","VT","WA","WI","WV","WY");
function listenerForI( i ) {
 document.getElementById(stateList[i])
 .addEventListener('mousedown', function() {
 stateSelect(stateList[i]);
 }, false);
}
for (var i = 0; i < stateList.length; i++) {
 listenerForI( i );
}
var HIdat = new Array(20,28,50,2) //one array for all 50 states COdat, AKdat, etc.
function stateSelect(state){
 var display_data1 = state + "dat[0]";
 alert(display_data1);
}

Should I use eval()? I've heard of something you can do with a global "window[]" but I don't understand how that would work.

• user113716: If you ever ask yourself "Should I use eval?", the answer is usually "No.". If you ever ask yourself "Should I use the global window?", the answer is usually "No.". ;o)

Answer 1

You should store the state arrays in their own object:

var stateData = {
 HI: [1, 2, 3],
 IL: [4, 5, 6],
 ...
};
var myData = stateData[state];

Answer 2

Using window is an option, like this:

window[state + "dat"] will get you the array.

But I would suggest ... exactly what SLaks just posted, so do that instead.

• Claudiu: that works but is such bad codin practice i have to downvote it =P. well i guess ill leave the downvote out.. but yea its not good
• James Montagne: @claud Not cool... I was going to suggest @SLaks solution but he beat me to it. Thought it was still good for him to understand how you can get variables in two ways .something and ['something'], which is useful in certain situations.
• James Montagne: Hah, @Slaks sorry for the name misspell, my fingers just want to type a c before a k...
• Claudiu: @kingjiv: hm i don't see how your answer shows the diff between .something and ['something']. i say it's bad practice cause you'd be creating a bunch of global vars and accessing them dynamically (basically doing eval) instead of putting it neatly in one array
• James Montagne: @claudiu yup, like I said, I agree the single object is better. But since he said "I've heard of something you can do with a global 'window[]'" I figured it was worth explaining. Wasn't complaining about the objection, just the downvote. And it's definitely not eval.

Answer 3

In JavaScript, global vars are members of the window object, so you can use the array indexing syntax to get at them without using eval, which is generally to be avoided, like so:

function stateSelect(state) {
 var display_data1 = window[state + "dat"];
 alert(display_data1);
}