14

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?

1

2 Answers 2

41

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

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

Comments

12

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

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

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.