Это ключевое слово в машинописном тексте не относится к классу

Question

У меня проблема с ключевым словом «this» в машинописном тексте. Как вы можете видеть ниже, я хочу вызвать метод1 из некоторой функции «внутри», например, метод FileReader.onloadend. Hovewer, 'this' ссылается на FileReader, а не на класс foo. Как я могу изменить свой код, чтобы сделать эту работу?

export class foo { 

    constructor() { 
     this.method2(); 
    } 

    public method1() { 
     console.log('method1 called');   // this never happens 
    } 

    public method2() { 
     let reader: FileReader = new FileReader(); 

     reader.onloadend = function(e) { 
      console.log(this)     //it prints FileReader object 
      this.method1();     //I want this to be refered to class foo 
     } 
    } 
} 

Answer 1

Используйте новую функцию синтаксис литерала с дальними стрелками:

public method2() { 
    let reader: FileReader = new FileReader(); 

    reader.onloadend = (e) => { 
     console.log(this) //it no longer prints FileReader object 
     this.method1(); //method1 called 
    } 
} 

Использование далека стрелкой, this теперь всегда относится к классу, вместо функции объема. Вы можете проверить MDN для получения дополнительной информации о Lexical this и синтаксисе функции короткой формы.

Документация для ES6, но она в равной степени относится к Typcript, поскольку это строгий суперсет.

Answer 2

Изменить это:

reader.onloadend = function(e) { 
    console.log(this)     //it prints FileReader object 
    this.method1();     //I want this to be refered to class foo 
} 

к этому:

reader.onloadend = (e) => { 
    console.log(this)     //it prints FileReader object 
    this.method1();     //I want this to be refered to class foo 
} 

Вы можете прочитать больше о функциях стрелок here.