How to correctly reference an object method within itself in Javascript? [duplicate]

Question

What is the correct way to reference an object function from within itself, so that I can call it several times using setTimeout in Javascript? In other words I want to be able to do this:

Foo.prototype.move = function() {
  if (this.count_a < 5) {
    this.count_a += 1;
    // setTimeout(this.move, 500);                    // doesn't work
    // setTimeout(function() { this.move(); }, 500);  // doesn't work
  }
}

I have tried a couple of things, none of which seem to work: http://jsfiddle.net/tga8r/1/

kennebec · Accepted Answer · 2014-03-21 08:13:53Z

1

this has a global scope when the window timer function runs- it is out of your function and in the window.

label the this-

Foo.prototype.move= function(){
    var T= this;
    if(T.count_a<5){
        T.count_a += 1;
        setTimeout(function(){T.move();},500);
    }
}

answered Mar 21, 2014 at 8:13

kennebec

105k32 gold badges109 silver badges127 bronze badges

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

Comments

Konstantin Krass · Accepted Answer · 2014-03-21 08:18:22Z

1

The this property within the timeout will point to the object, that does execute the passed callback.

use .bind(this) to say, that the invoker have to use the this point to the passed object.

Foo.prototype.move = function() {
  if (this.count_a < 5) {
    this.count_a += 1;
    // setTimeout(this.move, 500);                    
    setTimeout(function() { this.move(); }.bind(this), 500);  
  }
}

or use a reference:

Foo.prototype.move = function() {
  var self = this;
  if (this.count_a < 5) {
    this.count_a += 1;
    // setTimeout(this.move, 500);                    
    setTimeout(function() { self.move(); }, 500);  
  }
}

edited Mar 21, 2014 at 8:18

answered Mar 21, 2014 at 8:12

Konstantin Krass

8,6461 gold badge20 silver badges24 bronze badges

Comments

Qantas 94 Heavy · Accepted Answer · 2014-03-21 08:37:16Z

0

function move (a) {
    setTimeout(
        function() { 
           if (a < 10) {
            a = a+ 1; 
            move(a);
           } 
        }, 500); }

move(0);

edited Mar 21, 2014 at 8:37

Qantas 94 Heavy

16k31 gold badges74 silver badges89 bronze badges

answered Mar 21, 2014 at 8:18

Pratik

1,5501 gold badge9 silver badges9 bronze badges

Collectives™ on Stack Overflow

How to correctly reference an object method within itself in Javascript? [duplicate]

3 Answers 3

Comments

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Linked

Related