CODEWITHSUNDEEP
javascriptfunctionclasstypescripttimeout
Bioxcode
Bioxcode

Reputation: 179

TypeScript setTimeout loop passing this error

Trying to create a timer loop in TypeScript:

timeout() {
    setTimeout(function () {
        console.log('Test');
        this.timeout();
    }, 1000/60);
}

But after the first loop works correctly I'm getting this error: "Uncaught TypeError: this.timeout is not a function". It seems that the this variable does not exist after the initial loop. Any ideas?

Upvotes: 14

Views: 87987

Answers (2)

Suren Srapyan
Suren Srapyan

Reputation: 68665

Because your this doesn't refer to the object. Every function has it's own this. So your this is the one which is defined by anonymous function inside the setTimeout().

To make your program work, you need to hold the this before the timeout and use throught that variable.

class Test {
  
  timeout() {
      var that = this;
      setTimeout(function () {
          console.log('Test');
          that.timeout();
      }, 1000/60);
  } 
  
}


let t = new Test();
t.timeout();

Or you can work with lambda functions, which will keep the this to your object.Lamda's this will refer to the outer's this, which call the lambda function`.

class Test {
      
   timeout() {
       setTimeout(() => {
           console.log('Test');
           this.timeout();
       }, 1000/60);
   } 
      
}


let t = new Test();
t.timeout();

Upvotes: 41

Smiranin
Smiranin

Reputation: 746

Because of this context is lost. Use the arrow function this is better.

timeout() {
    setTimeout(() => {
        console.log('Test');
        this.timeout();
    }, 1000/60);
}

Upvotes: 12

Related Questions