在javascript中如何在另一个原型方法中调用一个原型方法？

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();
        }
    });
}

Answer 1

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.

Answer 2

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

Answer 3

whats about

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