javascript - ESLint pravilo koje zahtijeva streličaste funkcije u klasama kada se referencira `this`

Postoji li ESLint pravilo kojim se nalaže korištenje arrow funkcija u klasama, kad god se referencira this.

Javascript je poznat po čudnoj semantici vezanoj uz to kako je this vezan za funkciju.

Ponekad je poželjno da this bude vezan za pozivatelja, međutim kod metoda klase, gotovo uvijek to nije bila namjera programera.

Često može dovesti do neočekivanog ponašanja kada se metoda klase koristi kao funkcija višeg reda.

Volio bih imati ESLint pravilo koje će me upozoriti kada metoda klase NIJE definirana kao arrow funkcija.

Nametnut primjer zašto je ovo ponašanje nepoželjno:

type CelebrateBirthday = () => number

class Person {
    name: string
    age: number

    constructor(name: string, age: number) {
      this.name = name
      this.age = age
    }

    celebrateBirthday(): number {
      return ++this.age
    }

    celebratBirthdayArrow = (): number => {
      return ++this.age
    }
}


function celebrateBirthdayAndPrintAge(birthdayCelebrationFn: CelebrateBirthday) {
  console.log("Happy birthday, you are " + birthdayCelebrationFn() + " years old")
}


const person = new Person("bob", 10)

// works
celebrateBirthdayAndPrintAge(person.celebratBirthdayArrow)
// throws error "this is undefined"
celebrateBirthdayAndPrintAge(person.celebrateBirthday)

TS Playground veza za gore navedeni kod

Odgovor #1

Možete koristiti ovaj lint -> https://www.npmjs.com/package/eslint-plugin-prefer-arrow-functions

Mogu koristiti s ovom konfiguracijom lintanja:

 "rules": {
      "prefer-arrow-functions/prefer-arrow-functions": [
        "warn",
        {
          "classPropertiesAllowed": true,
          "disallowPrototype": false,
          "returnStyle": "unchanged",
          "singleReturnOnly": false
        }
      ],

Odgovor #2

Arrow funkcija po dizajnu ne veže ništa za this. Dakle, pokušaj pisanja arrow funkcija unutar definicije klase znači da ne možete pristupiti this, što je jedan od glavnih razloga za korištenje klase... pristup lokalnim podacima i metodama.

Pravilo ESLint-a za traženje onoga što tražiš zapravo bi narušilo ono što tvoja klasa pokušava učiniti.