在原型方法的回调函数中调用原型方法

Question

i have javascript class and 2 prototype methods

var proEdit = function(){
    this.client;
    var self = this;
}
/*
    class method to load all the project releted details 
*/
proEdit.prototype.loadProject = function(){
    this.client =  $serviceCall.setClient("getAllByProjectID","project"); // method name and service
    this.client.ifSuccess(function(data){  //sucess        
        self.kk();
    })
    this.client.ifError(function(data){ //falce
        console.log("error loading setting data")
    })
    this.client.projectID($stateParams.projectID); // send projectID as url parameters
    this.client.getReq(); // get request if post then use 'postReq('jsonbody')'
    return this;
}


proEdit.prototype.kk = function(){
    console.log("sass");
}

inside loadProject method, i'm calling an api using callback function to access data and if it is ifSuccess then i want call the kk prototype method. but it gives me this error.

angular.js:12722 TypeError: self.kk is not a function

i try to create new instance to the same class and then call the kk function. then it is working

  this.client.ifSuccess(function(data){  //sucess  
      var in = new proEdit();   
      in.kk();
  })

is it happening because of the callback? how can i prevent this. Thank you

Answer 1

As commented, you should use .bind

Sample

 window.name = "Bar" var MyClass = function(name) { this.name = name; } MyClass.prototype.notify = function() { console.log(this.name) } var m = new MyClass('Foo'); setTimeout(m.notify, 2000); setTimeout(m.notify.bind(m), 2000); 

Answer 2

you can change ths code like this:

var proEdit = function(){
    this.client;
    // var self = this;
}
/*
    class method to load all the project releted details 
*/
proEdit.prototype.loadProject = function(){
    var that = this;
    this.client =  $serviceCall.setClient("getAllByProjectID","project"); // method name and service
    this.client.ifSuccess(function(data){  //sucess        
        that.kk();
    })
    this.client.ifError(function(data){ //falce
        console.log("error loading setting data")
    })
    this.client.projectID($stateParams.projectID); // send projectID as url parameters
    this.client.getReq(); // get request if post then use 'postReq('jsonbody')'
    return this;
}


proEdit.prototype.kk = function(){
    console.log("sass");
}

Hope it helps!

Answer 3

finally found the answer. as mention in the comment, need to use the bind to pass the this to callback

var proEdit = function(){
    this.client;
    var self = this;
}
/*
    class method to load all the project releted details 
*/
proEdit.prototype.loadProject = function(){
    this.client =  $serviceCall.setClient("getAllByProjectID","project"); // method name and service
    this.client.ifSuccess((function(data){  //sucess
        console.log(data) 
        $scope.project = data.project[0];
        $scope.task = data.task;
        $scope.user = data.user;
        $scope.balance = data.balance[0];
        this.kk();
    }).bind(this))
    this.client.ifError(function(data){ //falce
        console.log("error loading setting data")
    })
    this.client.projectID($stateParams.projectID); // send projectID as url parameters
    this.client.getReq(); // get request if post then use 'postReq('jsonbody')'
    return this;
}


proEdit.prototype.kk = function(){
    console.log("sass");
}