How can I pass methods in javascript?

Question

I often need to pass methods from objects into other objects. However I usually want the method to be attached to the original object (by attached I mean 'this' should refer to the original object). I know a few ways to do this:

a) In the object constructor: ObjectA = function() { var that = this; var method = function(a,b,c) { that.abc = a+b+c }}

b) In objectA which has been passed objectB: objectB.assign(function(a,b,c) { that.method(a,b,c) })

c) Outside both objects: objectB.assign(function(a,b,c) { objectA.method(a,b,c) })

I want to know if there is a simpler way to pass methods attached to their original objects.

ob1 · Accepted Answer · 2010-06-07 14:13:41Z

4

You can define a "createDelegate" method for all functions:

Function.prototype.createDelegate = function(scope) {
    var method = this;
    return function() {
        return method.apply(scope, arguments);
    }
}

And then use like:

var myDelegate = myFunction.createDelegate(myScope);

calling "myDelegate" will execute "myFunction" with "this" pointing to "myScope" and the same arguments as passed to myDelegate

edited Jun 7, 2010 at 14:13

answered Jun 6, 2010 at 11:10

ob1

1,72110 silver badges25 bronze badges

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

9 Comments

peterjwest Over a year ago

Thanks, this is perfect! Although I don't understand it yet.

T.J. Crowder Over a year ago

It may also be worth looking at the current (1.7 RC 2) source of Prototype's Function#bind, which serves the same purpose as ob1's createDelegate but which went through quite a round of performance testing and optimization a few months back: github.com/sstephenson/prototype/blob/master/src/lang/… Separately: I'd use scope || undefined rather than scope || window, to avoid the unnecessary browser-specificity and issues with window being overwritten. Calls to apply using undefined as the scope will use the global object.

T.J. Crowder Over a year ago

@peterjwest: "Although I don't understand it yet." It's basically doing what you were doing: Creating a function that, when called, will call the actual target function using the given context (this value). Sometimes it's more efficient to use a closure for this (where you have var self = this and then a function that uses self.foo() that closes over it), other times it's more efficient to create a delegate as with ob1's example -- and the latter is clearer to people who are relatively new to Javascript and/or who don't understand closures very well, which is of value.

peterjwest Over a year ago

What kind of efficiency are you talking about: programming or performance? Could you give some examples of when either method is preferable?

ob1 Over a year ago

@T.J. The provided implementation does this exact thing - creates a function which closes over the method, scope and callArgs.

|

Luca Matteis · Accepted Answer · 2010-06-06 11:00:31Z

0

As long as you call the other method with its appropriate owner object, this will always refer to the correct owner.

edited Jun 6, 2010 at 11:00

answered Jun 6, 2010 at 10:55

Luca Matteis

29.3k22 gold badges116 silver badges172 bronze badges

1 Comment

peterjwest Over a year ago

How do you propose I would do this? Pass the object and a string representing the method: assign(object, 'method')? I don't want the method name to be hard coded in the other object

kennebec · Accepted Answer · 2010-06-06 15:05:24Z

0

You can delegate if you like, or just call the object that lacks the method from the defined method scope-

instance.method.call(Other-Object/*,argument,...*/)

For example, if Array has a filter method, you can call it as if it were a method of a node list object.

var list=document.getElementsByTagName('p'), a=[], 

list= a.filter.call(list,function(itm){return itm.className=='sidebar'});

answered Jun 6, 2010 at 15:05

kennebec

105k32 gold badges109 silver badges127 bronze badges

Collectives™ on Stack Overflow

How can I pass methods in javascript?

3 Answers 3

9 Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

9 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related