web-dev-qa-db-ja.com

このエラーを渡すTypeScript setTimeoutループ

TypeScriptでタイマーループを作成しようとしています：

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

しかし、最初のループが正しく機能した後、「Uncaught TypeError：this.timeout is not function」というエラーが表示されます。この変数は、最初のループの後には存在しないようです。何か案は？

javascriptfunctionclasstypescripttimeout
8
Ben Hayward

thisはオブジェクトを参照しないためです。すべての機能には独自のthisがあります。したがって、あなたのthisは、setTimeout()内の無名関数によって定義されるものです。

プログラムを機能させるには、タイムアウト前にthisを保持し、その変数を使用する必要があります。

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


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

または、lambda functionsは、thisをオブジェクトに保持します。Lamdaのthisは、ラムダ関数を呼び出すアウターのthisを参照します。

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


let t = new Test();
t.timeout();
27
Suren Srapyan

このため、コンテキストは失われます。これが良い矢印関数を使用してください。

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