In javascript how can I call one prototype method in another prototype method?

Question

suppose I have a function:

function test(){}

test.prototype.method01=function(){
    //do something
}

test.prototype.method02=function(){
    //how can I call the method01?
    //this.method01()...?
    //but the chrome through an error:
    //Uncaught TypeError: Object #<HTMLImageElement> has no method 'method01'
}

Edited: in fact the method01 like this:

test.prototype.method02=function(){
    $('.cpy').resizable({

    }).draggable({
        start:function(e,ui){
            this.method01();
        }
    });
}

Are you assigning `method02` to an event of an image by any chance? — pimvdb, Mar 17 '12 at 12:27
It depends on *how* you call `method02`. You should read the [MDN article about `this`](https://developer.mozilla.org/en/JavaScript/Reference/Operators/this). — Felix Kling, Mar 17 '12 at 12:29
As so often in jQuery, inside the `start` callback, `this` refers to the element you call `draggable` on, in this case `.cpy`. You have to keep a reference to the `this` of `method02`. — Felix Kling, Mar 17 '12 at 12:34
Related: http://stackoverflow.com/questions/8778874/calling-one-prototype-method-inside-another-in-javascript — user11153, Jan 24 '14 at 10:00

score 13 · Accepted Answer · answered Mar 17 '12 at 12:33

test.prototype.method02=function(){
    var testThing = this;
    $('.cpy').resizable({

    }).draggable({
        start:function(e,ui){
            testThing.method01();
        }
    });
}

You have to preserve the this reference in another local variable so that the callback function can use it when calling the other method. The this reference is bound upon each and every function call, including calls to callback functions like the one you're using in the ".draggable()" setup. When that's called this will be set to something different from the this in your "method02" function.

score 2 · Answer 2 · answered Mar 17 '12 at 12:44

Yea, you could manually cache this in the lexical scope like other answers in this question suggest. However, the alternative that i would suggest is to create a bound method using $.proxy or function.bind as your call back.

Bound methods are always called with a stable this. I find them to be much more readable, than bizarrely named references to this in higher scopes

score 0 · Answer 3 · answered Apr 17 '14 at 18:18

0

whats about

test.prototype.method02=function(){
     this.method01.apply(this);
     // do some other stuff
}

answered Apr 17 '14 at 18:18

L. Monty

872
9
17

In javascript how can I call one prototype method in another prototype method?

3 Answers3