call javascript object method with a variable

Question

i am new to object oriented javascript. I have a variable whose value i would like to use to call an object's method. like this..

var foo = {
    bar: function() {},
    barr: function() {}
}

now there is a variable whose value can be any of the two method's names bar and barr i want to call them with something like

var myvar = 'bar';
foo.{myVar}();

If you are starting to learn JavaScript, this may be a nice article to read: John Resig's [Learning Advanced Javascript](http://ejohn.org/apps/learn/). I know it says "advanced", but it starts from basic examples, and has a nice interactive interface for modifying and running the code. — vgru, Jul 18 '11 at 19:04
@Groo hey! thanks alot! a am new to object stuff and TBH they are a bit confusing.. :O but i am on it :D — Achshar, Jul 18 '11 at 19:06

score 51 · Accepted Answer · answered Jul 18 '11 at 18:54

51

So I assume you want to call the appropriate function dynamically based on a string. You can do something like this:

var myVar = 'bar';
foo[myVar]();

Or you can also use eval but this is riskier (prone to injection attack) and slower (don't do this! :P):

var myVar = 'bar';
eval('foo.' + myVar + '()');

answered Jul 18 '11 at 18:54

pixelfreak

1

thanks.. there are so many answers :O looks like i asked a n00b question :P but hey thanks every body :) – Achshar Jul 18 '11 at 19:00
1

There is no n00b question except the one that was just answered :) – pixelfreak Jul 18 '11 at 19:04
:D so apparently they work like arrays too.. we can call them like we call an array `array['key']`. interesting. thnx! – Achshar Jul 18 '11 at 19:08
@Achshar - In your example, foo is an object. All objects can access their properties with array-type syntax. It isn't really an array (which is why I wrote this comment to make sure you don't think it's an array), but you can use the foo['x'] syntax to access the properties just the same as you can use foo.x. – jfriend00 Jul 18 '11 at 19:21
@jfriend00 oh yeaa i know that right :) i was just wondering that the syntax is same so that devs don't have to remember a bunch of different syntaxes for all the different things in the language :D – Achshar Jul 18 '11 at 19:33
If people shouldn't do something, don't put it in the answer! – miken32 Dec 22 '17 at 17:05

score 11 · Answer 2 · answered Jul 18 '11 at 18:55

11

Since you can access elements of an object via subscript notation, the following will do what you're looking for:

var myVar = 'bar';
foo[myVar]();

answered Jul 18 '11 at 18:55

yan

score 8 · Answer 3 · answered Jul 18 '11 at 18:55

8

You can just say:

foo[myVar]();

Since foo is a JavaScript object, this code will reference the member by name contained in the myVar variable.

answered Jul 18 '11 at 18:55

Justin Ethier

score 5 · Answer 4 · answered Jul 18 '11 at 18:56

5

var foo = {
    bar: function() { alert('bar'); },
    barr: function() { alert('barr'); }
}


var myvar = 'bar';
foo[myvar](); // alert 'bar'

answered Jul 18 '11 at 18:56

wanovak

score 4 · Answer 5 · answered Jul 18 '11 at 18:55

4

Use something like: foo[myVar]();

answered Jul 18 '11 at 18:55

Mrchief

calling inside the object methods this way doesn't seem to work. using try/catch the message says 'this[myVar] is not a function' – Scott May 04 '15 at 17:36

score 4 · Answer 6 · answered Jul 18 '11 at 18:55

4

it should be something like this

foo[myvar]();

answered Jul 18 '11 at 18:55

John Hartsock

6 Answers6