使用'this'和內部作用域命名函數的Typescript問題

Question

寫這個的正確方法是什麼？

class Test { 
    log(data) { ... } 
    queryFailed(error) { ... } // Generic error handler 
    runQuery(data) { 
     doStuff() 
     .then(querySuccess) 
     .catch(this.queryFailed); 

     function querySuccess(data) { // query specific success handler 
      this.log("Success!"); // "this" is undefined 
      ... 
     } 
    } 
} 

我知道我能做到像內聯：

class Test { 
    log(data) { ... } 
    queryFailed(error) { ... } // Generic error handler 
    runQuery(data) { 
     doStuff() 
     .then((data) => { 
      this.log("Success!"); // 'this' is really '_this' now and set to 'this' right above 'doStuff()' in the compiled javascript 
      ... 
     }) 
     .catch(this.queryFailed); 

     function querySuccess 
    } 
} 

但遮住了邏輯從doStuff()

的結果使用.bind（本）內嵌的正確方法？

class Test { 
    log(data) { ... } 
    queryFailed(error) { ... } // Generic error handler 
    runQuery(data) { 
     doStuff() 
     .then(querySuccess.bind(this)) 
     .catch(this.queryFailed); 

     function querySuccess(data) { // query specific success handler 
      this.log("Success!"); // "this" works 
      ... 
     } 
    } 
} 

Answer 1

我建議是這樣的：

class Test { 
    log(data) { } 
    static queryFailed(error) { } // Make sure we don't try to use 'this' here 
    runQuery(data) { 
     var querySuccess = data => { // query specific success handler 
      this.log("Success!"); // Correct 'this' 
     } 

     doStuff() 
     .then(querySuccess) 
     .catch(Test.queryFailed(error)); 
    } 
} 

或者：

class Test { 
    log(data) { } 
    static queryFailed(error) { } 
    querySuccess = (data) => { 
     this.log('Success'); 
    } 
    runQuery(data) { 
     doStuff() 
     .then(this.querySuccess) 
     .catch(Test.queryFailed); 
    } 
}