Javascript What is best practice using IF or SWITCH or "dynamic function name" in this case

Question

I am looking for a best practice in this hypothetical situation.

In the example below the function changeGallery0() is a unique function that is Not the same as changeGallery1(), changeGallery2(). They can not be modified to solve this. But each function does take the exact same data (newArrayData)

This code seems "ugly" but works properly. It would become more ugly with 20 galleries. I realize some of this problem exists with the calling unique functions, but it helps illustrate my question.

Using a SWITCH case seems to be more proper. But does it have any advantage over this IF based solution? It seems like a "dynamic function name" (does that exist) would make sense?

Thank you!

if (a == 0) changeGallery0(newArrayData);
if (a == 1) changeGallery1(newArrayData);
if (a == 2) changeGallery2(newArrayData);
if (a == 3) changeGallery3(newArrayData);

why cant you have a function called changegallery(newArrayData,galleryNumber) and then use that to branch only on specific code inside that function. This way you might have to update all functions if a common change is required at least if a new variable is added to newArrayData or its type changes. — Farrukh Subhani, Jan 03 '14 at 18:30
For the record, switch is usually faster than if/else. See [this question](http://stackoverflow.com/questions/2922948/javascript-switch-vs-if-else-if-else). — ringstaff, Jan 03 '14 at 18:32
True, but for this question I would like to assume newArrayData will not change. For example newArrayData is an array of URL strings. — marksjack, Jan 03 '14 at 18:37

score 2 · Accepted Answer · answered Jan 03 '14 at 18:31

2

You could try something like this:

var fn = window['changeGallery' + a];
if (typeof fn === "function")  {
    fn.apply(null, newArrayData);
}

The first argument to "apply" would be "this" in your function call.

answered Jan 03 '14 at 18:31

El Guapo

5,253
7
51
78

Question: the difference between this answer and Danny's answer below is this will test if the function exists before calling it? – marksjack Jan 03 '14 at 21:32
yes... and you can set the "this" scope to something different in your method if you desire. – El Guapo Jan 06 '14 at 17:24

score 2 · Answer 2 · answered Jan 03 '14 at 18:32

2

You could do

window["changeGallery" + a](newArrayData);

answered Jan 03 '14 at 18:32

Danny

6,838
8
40
65

score 0 · Answer 3 · answered Jan 03 '14 at 18:32

0

I think it would be better to use a for loop. You can place functions inside an array.

var funcArray = [function1, function2 , function3, ...];

answered Jan 03 '14 at 18:32

Spencer Wieczorek

19,788
7
39
50

score 0 · Answer 4 · answered Jan 03 '14 at 18:35

There is one thing you need to know about this that is how branching will occur with if else or switch.

With if else if a is 0 the first one will be hit and then you miss rest of 3 but still need to check condition.
With switch you will have branches done but actual code will have a break after one and not check rest of conditions.

You can achieve same with if by using else statements like if a is not 0 then check if its 1 otherwise no need to do so If a is not 1 then check if its 2 otherwise no need to do so this would create nested if else statements that are similar to a switch branching and switch would read better in code so use that.

Javascript What is best practice using IF or SWITCH or "dynamic function name" in this case

4 Answers4