How to pass an integer to create new variable name?

Question

I have 50 svg animations named animation0, animation1, animation2 etc. and I want to load them when the integer 0 to 49 is passed to this function:

function loadAnimation(value){
    var whichswiffy = "animation" + value;
    var stage = new swiffy.Stage(document.getElementById('swiffycontainer'), whichswiffy);
    stage.start();
}

It doesn't work at the moment, maybe it's passing 'whichswiffy' rather than animation10?

Any ideas?

No, the value is passed; you can check it with `console.log(whichswiffy)`; — raina77ow, Jul 07 '12 at 15:04
*"It doesn't work at the moment, maybe it's passing 'whichswiffy' rather than 'animation10'?"* Definitely not, if `value` is `10` (or `"10"`), the value passed will be `"animation10"` (a string, not a number). — T.J. Crowder, Jul 07 '12 at 15:05
@imm any element will be automatically converted to string if you try to "add" it with another string — fmsf, Jul 07 '12 at 15:06
Joe, what is the second argument to `swiffy.Stage` meant to be? Is it meant to be a string (which is what you're passing it)? Or what? — T.J. Crowder, Jul 07 '12 at 15:07
Hi guys- thanks for your replies - I'm a quite a novice, but what I know is that if I put 'animation10' instead of 'whichswiffy' the animation will load and play each time the function is executed — Joe, Jul 07 '12 at 15:10
hmm the error is within swiffy/runtime.js 'Uncaught typeError: cannot read 'xmax' of undefined — Joe, Jul 07 '12 at 15:13
I tried this out on jsFiddle and it does pass the animation10 correctly. I guess the problem is with your callback? — , Jul 07 '12 at 15:20
I was using animation10 without quotes to load the animation correctly — Joe, Jul 07 '12 at 15:22
thanks for your replies guys! window[whichswiffy] works fine and doesn't cause an error in googles swiffy runtime.js. I wonder why window[whichswiffy] works but whichswiffy doesn't? — Joe, Jul 07 '12 at 15:23
@Joe: Because `window[whichswiffy]` looks up a property on the `window` object with the name held by the string in `whichswiffy`, whereas `whichswiffy` is just the string. The `window` object holds all global variables, and gets all sorts of other things thrown into it, including all elements that have an `id` attribute. Do you have an element with the `id` `"animation10"`, by any chance? — T.J. Crowder, Jul 07 '12 at 15:29
no I don't - maybe the problem is a quirk of google's crazy complex code, very glad it's working :-) — Joe, Jul 07 '12 at 15:34
@Joe: Then do you have an element with that `name`, or a global variable with that name? There's *some* reason there's a property on `window` with that name. — T.J. Crowder, Jul 07 '12 at 15:37
possible duplicate of [Is there a way to access a javascript variable using a string that contains the name of the variable?](http://stackoverflow.com/questions/1441532/is-there-a-way-to-access-a-javascript-variable-using-a-string-that-contains-the) — apsillers, Jul 07 '12 at 18:36

score 5 · Answer 1 · 2012-07-07T15:17:22.410

"I have 50 svg animations named animation0, animation1, animation2 etc."

Using global variables

I assume this means you have variables. If they're global variables, you can access them as a property of the global object.

var whichswiffy = window["animation" + value];

Using an Object instead of variables

But if they're not global variables (or even if they are), you'd be better off storing them in an Object...

var animations = {
    animation0: your first value,
    animation1: your second value,
    /* and so on */
}

...and then access them as properties of that object...

var whichswiffy = animations["animation" + value];

Using an Array instead of variables

Or better, just use an Array since the only differentiation is the number...

var animations = [
    your first value,
    your second value,
    /* and so on */
]

then just use the index...

var whichswiffy = animations[value];

thanks for your response! Cool I'll structure my code in this way- I would've never thought of that. It will make it so much more managable. Cheers :-) — Joe, Jul 07 '12 at 15:30

score 2 · Accepted Answer · answered Jul 07 '12 at 15:06

2

If your variables are global, you could do

var stage = new swiffy.Stage(document.getElementById('swiffycontainer'), window[whichswiffy]);

answered Jul 07 '12 at 15:06

xdazz

158,678
38
247
274

wow aha!! thanks so much this works! although I do not know what it means? what is window if i may ask? – Joe Jul 07 '12 at 15:15
@Joe You could thing window is the super global variable, you could access any global variables through it. – xdazz Jul 07 '12 at 15:17
cool thanks! do you know why this works and the other doesn't? – Joe Jul 07 '12 at 15:28

How to pass an integer to create new variable name?

2 Answers2