typescript - Eslint-regel no-invalid-this och fet pilfunktion i klass


Jag har följande klass:

export class MyClass {
  private foos: Foo[];

  constructor(foos: Foo[]) {
    this.foos = foos;
  }

  getByA = (myA: Mya): Foo => {
    return this.foos.find(foo => foo.a === myA) ?? unknownFoo();
  };
}

tyvärr, i min fetpilfunktion får jag en varning om ogiltig this:

ESLint: Unexpected 'this'.(no-invalid-this)

Min eslint-plugin-version är 4.15.1

Finns det något jag kan göra för att få denna regel att fungera korrekt förutom att inaktivera den?

Svar #1

Du får detta fel eftersom när du skapar en pilfunktion, skapar du ett objekt som kan kallas i ett annat sammanhang av din klass. Så när getByA körs kan det vara i ett sammanhang där this inte existerar eller är annorlunda.

Ett alternativ är att binda kontexten till arrow-funktionen:

getByA = (myA: Mya): Foo => {
    return this.find(foo => foo.a === myA) ?? unknownFoo();
}.bind(this.foos);

För mer resurser om detta fel och exempel på hur man korrekt använder this i rätt sammanhang, titta här.

Relaterade artiklar