How to call a function by a variable name

Question

My question is sort of complex but I will try to word as best I can.

I am making a website with that involves a lot of javascript. I don't have everything setup so some of the scripts aren't hooked up with anything. I want to make a popup console that will allow me to type in what function I want the computer to preform and have the computer do so.

Can I have a variable and then call a function with that variable example:

var CodeApprentice = "Cat";
function Cat(){
  document.write("kitten");
} 
function Dog(){
  document.write("puppy");
}
//Here is were I want to call the function with the variable   CodeApprentice   
// and have it do the cat function
function CodeApprentice();

I know I am not doing this correctly, but is there a way to do this or am I just crazy?

yes. in JS any function is an object. just assign `var CodeApprentice = Cat` and then `CodeApprentice();` — Artur Udod, Jun 10 '13 at 14:12

score 3 · Answer 1 · answered Jun 10 '13 at 14:12

3

you can store all the available functions in an object

var availableFunctions {
  cat: correspondingFunction
}

then you can get input as a string

var input = 'cat';

availableFunctions[input]();

answered Jun 10 '13 at 14:12

dm03514

54,664
18
108
145

Mulan · Answer 2 · 2013-06-10T14:32:50.667

1

Use .call or .apply

var codeApprentice = Cat;

codeApprentice.call(null);

You could have a cleaner solution with some better composition

// my_class.js
var MyClass = function() {};

MyClass.Cat = function() {
  document.write("kitten");
};

MyClass.Dog = function() {
  document.write("puppy");
};

// usage
var codeApprentice = "Cat";
MyClass[codeApprentice].call(null);
// => "kitten"

Here's a fiddle with some HTML controls

edited Jun 10 '13 at 14:32

answered Jun 10 '13 at 14:15

Mulan

129,518
31
228
259

that's different from `Cat()` since it set the `this`pointer to the object passed as the first argument in this case `null`. If you just did `codeApprentice()` then it would be the same as `Cat()` – Rune FS Jun 10 '13 at 14:20
So that would do the cat function? – Jun 10 '13 at 14:20
I've updated my answer with a [working example](http://jsfiddle.net/m7S4b/2/) you can see – Mulan Jun 10 '13 at 14:33

score 1 · Accepted Answer · answered Jun 10 '13 at 14:18

You can access any property of an object in two ways either dot notation

obj.propertyName

or using the property name as a key

obj["propertyName"]

any function you define in the global name sapce will become part of the global object so in your case you can do

//this is meant as a to the global object other names might be appropriate
//such as window depending on the context
this[CodeApprentice]()

to execute the funciton Cat

writing

function Cat() {
}

is equivalent to

Cat = function(){
}

where the latter is more explicitly showing that it's actually a property of thisbeing set (I didn't say it's obvious just that it hides the fact less than the previous)

as a final note it's a general convention that functions that start with an upper case letter are constructors and should be called with the new key word e.g. new Cat() since that's probably not what you want in this case you should think about renaming the function (if the actual code has functions starting with upper case letters)

Thank you sooooo much for answering my question so well. Your answer was well put together and you really helped me understand how it works. :) — , Jun 10 '13 at 14:27

score 0 · Answer 4 · answered Jun 10 '13 at 14:14

you can do it like this and even pass parameters in it

var strFun = "Cat";
var strParam = "";

//Create the function
var fn = window[strFun];

//Call the function
fn(strParam);

Or you can do it using the eval() function like this

var strFun = "Cat";
var strParam = "";

//Create the function call from function name and parameter.
var funcCall = strFun + "('" + strParam + "');";

//Call the function
var ret = eval(funcCall);

How to call a function by a variable name

4 Answers4

Linked