Javascript Classes - Accessing a function on the fly

Question

I have a javascript class:

MyClass = function(){
    this.m_SomeData = 5;
};

and I have created some functions for that class:

MyClass.prototype.MyClassFunction_1 = function(arg){
    // Some stuff that can return false
    return true;
};
MyClass.prototype.MyClassFunction_2 = function(arg){
    // Some stuff that can return false
    return true;
};
MyClass.prototype.MyClassFunction_3 = function(arg){
    // Some stuff that can return false
    return true;
};

Later on I have created an instance of that class. (They could be combined into a single function but there are design issues that make it nicer to separate them):

var myInstance = new MyClass();

Now the tricky bit. In an 'if' statement I am doing the following (as well as other stuff).

var funcUse;
var arg = 3; // Some value created at run time)
if((funcUse = val === 0 ? MyClassFunction_1
                        : (val === 1 ? MyClassFunction_2 : MyClassFunction_3)) !== "undefined" &&
    myInstance.funcUse(arg)){
}

The obvious problem is in the 'if' statement MyClassFunction_? are all undefined as they should be tied to an instance of the class, eg myInstance.MyClassFunction_?.

So how can this be done nicely in an if statement?

Methods are just properties with function values. You can use bracket notations for them as well. — Bergi, Jun 18 '16 at 19:43
Hi @Bergi, can you explain what you mean? (@melpomene - that is one way you create classes in javascipt.) — Rewind, Jun 18 '16 at 19:46
@Rewind: https://stackoverflow.com/questions/4968406/javascript-property-access-dot-notation-vs-brackets — Bergi, Jun 18 '16 at 19:47
@melpomene: constructor + prototype form a class (even when the prototype is empty) — Bergi, Jun 18 '16 at 19:51
@melpomene, A class is just a template definition of an object's properties and methods. It's incorrect place to holywars here. — vp_arth, Jun 18 '16 at 19:55

melpomene · Accepted Answer · 2016-06-18T19:51:15.120

You can do this:

var funcUse =
    val === 0 ? 'MyClassFunction_1' :
    val === 1 ? 'MyClassFunction_2' :
    'MyClassFunction_3';

if (myInstance[funcUse] && myInstance[funcUse](arg)) {
    ...
}

Dot notation (obj.property) is just syntactic sugar for obj["property"], so you can simply make funcUse a string.

Alternatively, you can also do this:

var funcUse =
    val === 0 ? myInstance.MyClassFunction_1 :
    val === 1 ? myInstance.MyClassFunction_2 :
    myInstance.MyClassFunction_3;

if (funcUse && funcUse.call(myInstance, arg)) {
    ...
}

This extracts the function from the myInstance object, but then you have to be careful with calling funcUse to make sure myInstance is passed as this.

Paul S. · Answer 2 · 2016-06-18T20:02:13.530

Don't worry about "classes"/inheritance, the problem you want to solve is really two more simple ones,

Accessing a property of an Object dynamically
Choosing the context/this of a function

You have a couple choices about which pattern to use

fn.call / fn.apply

var o = {foo: 'bar'};

function fizz() {return this;}

fizz.call(o); // returns `o`, Object {foo: 'bar'}

Bracket notation

var o = {foo: function () {return this}};

o['foo'](); // returns `o`

In your particular case I'd probably go with a switch..case or if..else pattern to decide on the property name, then invoke with bracket notation;

var method;
switch (val) {
    case 0: method = 'foo'; break;
    case 1: method = 'bar'; break;
}

if (method)
    o[method]();

Thanks for the informative input. I marked melpomene's answer with the tick as it appeared first. But thanks again. — Rewind, Jun 18 '16 at 22:26

Javascript Classes - Accessing a function on the fly

2 Answers2