typescript1.8 - Esta palavra-chave em typescript não se refere à classe
Eu tenho um problema com a palavra-chave 'this' em TypeScript. Como você pode ver abaixo, eu quero chamar o método1 de alguma função 'interna', por exemplo, o método FileReader.onloadend. No entanto, 'this' referencia o FileReader, e não a classe foo. Como posso mudar meu código para fazer isso funcionar?
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
}
}
}
Resposta #1
Use a nova sintaxe literal de função com setas longas:
public method2() {
let reader: FileReader = new FileReader();
reader.onloadend = (e) => {
console.log(this) //it no longer prints FileReader object
this.method1(); //method1 called
}
}
Usando arrow functions, this agora sempre se refere à classe, em vez do escopo da função. Você pode conferir o MDN para mais informações sobre this léxico e a sintaxe curta de funções.
A documentação é para ES6, mas se aplica igualmente ao Typescript, já que é um superset estrito.
Resposta #2
Mude isto:
reader.onloadend = function(e) {
console.log(this) //it prints FileReader object
this.method1(); //I want this to be refered to class foo
}
para isto:
reader.onloadend = (e) => {
console.log(this) //it prints FileReader object
this.method1(); //I want this to be refered to class foo
}
Você pode ler mais sobre funções arrow aqui.
