Dynamically Instantiate a Function & Call a Method in JavaScript

Question

Take this JavaScript class:

var Foo = function() {

    this.bar = function() {
        return 'foobar';
    };

};

I can instantiate this class and call it's bar method like this:

(new Foo).bar();

I would like to achieve the instantiation and calling of the class and it's method dynamically based of a string that represents a class and method like Foo@bar.

I have tries the following to achieve this but receive the error Uncaught TypeError: string is not a function:

var action = 'Foo@bar';
var classMethod = action.split('@');

(new classMethod[0]).call(classMethod[1]);

Is this even possible in JavaScript or am I going about this in the wrong way?

(new classMethod[0])[classMethod[1]]() a bit strange tough that you would want to do this, what actual problem are you trying to solve ? — Willem D'Haeseleer
– Willem D'Haeseleer, Commented May 29, 2015 at 16:52
@WillemD'haeseleer I have certain classes that need to be instantiated automatically in the code and methods that need to be called without manually having to new up objects and call their methods. Your method (new classMethod[0])[classMethod[1]]() throws the following error: Uncaught TypeError: string is not a function. — James Craig
– James Craig, Commented May 29, 2015 at 16:56

Nicholas Daley-Okoye · Accepted Answer · 2015-05-29 16:58:30Z

1

You could do something with eval. But I won't show that because eval is evil.

If you are willing to create an object containing the types that can be created:

var Foo = function() {
    this.bar = function() {
        return 'foobar';
    };
};  
var types = {
    Foo : Foo
};

var action = 'Foo@bar';
var classMethod = action.split('@');

(new types[classMethod[0]])[classMethod[1]]();

The problem with your code was that classMethod[0] is a string. But to use new you need to give it a function. In my code I make use of javascript's [] operators which accesses properties of an object using a string containing the property's name. First I use it to get the Foo property from the types object. This is your constructor. Then after calling the constructor, I use the [] operators again to get the bar property.

answered May 29, 2015 at 16:58

Nicholas Daley-Okoye

2,4471 gold badge19 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

deadboy · Accepted Answer · 2015-05-29 16:53:32Z

0

Assuming you have a Foo object

var foo = new Foo();

You can say foo["bar"](); to call a method called bar on it.

answered May 29, 2015 at 16:53

deadboy

8592 gold badges9 silver badges28 bronze badges

Comments

Bartosz Gościński · Accepted Answer · 2015-05-29 16:58:21Z

0

To access constructor by names you need to have it accessible in some collection. For example:

var Foo = function() {
    this.bar = function() {
        return 'foobar';
    };
};

var constructors = {
  Foo: Foo,
  Bar: Bar
};

function instantiateAndInvoke(action) {
  var classMethod = action.split('@');
  var constr = constructors[classMethod[0]];
  var instance = new constr();

  return instance[classMethod[1]]();
}

// and then
var result = instantiateAndInvoke('Foo@bar');

answered May 29, 2015 at 16:58

Bartosz Gościński

1,5801 gold badge16 silver badges29 bronze badges

Comments

Oriol · Accepted Answer · 2015-05-29 16:59:22Z

0

classMethod[0] is a string, so you can't use it as a constructor.

Assuming Foo is a global function,

new window[classMethod[0]]()[classMethod[1]]();

answered May 29, 2015 at 16:59

Oriol

291k71 gold badges459 silver badges535 bronze badges

Collectives™ on Stack Overflow

Dynamically Instantiate a Function & Call a Method in JavaScript

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related