Können Pfeilfunktionen Klassenmethoden in ES6 dauerhaft binden?

So binden Sie Klassenfunktionen mithilfe von Pfeilfunktionen in ES6-Klassen dauerhaft

ES6-Klassen bieten eine präzisere Möglichkeit, objektorientierten JavaScript-Code zu schreiben . Wenn es jedoch um die Definition von Klassenmethoden geht, fragen sich Entwickler möglicherweise, ob es möglich ist, die Methode mithilfe von Pfeilfunktionen dauerhaft an die Klasseninstanz zu binden, ähnlich wie es mit CoffeeScript möglich ist.

Problem:

Traditionell werden Klassenmethoden mithilfe der bind()-Methode innerhalb des Konstruktors an die Instanz gebunden. Die Verwendung von Pfeilfunktionen führt jedoch zu syntaktischen Unterschieden, die einen geänderten Ansatz erfordern.

Syntax:

Um eine Klassenfunktion als Klasseninstanzmethode mithilfe einer Pfeilfunktion zu binden, muss die Folgende Syntax kann verwendet werden:

class SomeClass extends React.Component {
  handleInputChange = (val) => {
    console.log('selectionMade: ', val);
  }
}

Beachten Sie die Unterschied:

Im Vergleich zum herkömmlichen Ansatz erfordert die Pfeilfunktion ein Gleichheitszeichen (=) nach dem Eigenschaftsnamen.

Experimentelle Funktion:

Diese Funktion gilt derzeit in Babel als experimentell. Um es verwenden zu können, muss das Transform-Class-Properties-Plugin aktiviert sein. Dies kann durch Hinzufügen zum Plugin-Abschnitt der Babel-Konfigurationsdatei erfolgen:

{
  "plugins": [
    "transform-class-properties"
  ]
}

Verwendungsbeispiel:

Sobald die Funktion aktiviert ist, können Entwickler weitermachen Die Klassenmethode wird als Rückruffunktion verwendet und ist auf die Klasseninstanz und nicht auf das Fensterobjekt beschränkt. Der folgende Code würde beispielsweise den Wert von „val“ innerhalb der SomeClass-Instanz protokollieren:

setTimeout(SomeClass.handleInputChange, 1000, 'foo');

Schlussfolgerung:

Durch die Nutzung von Pfeilfunktionen und die Aktivierung von Mit dem Transform-Class-Properties-Plugin können Entwickler Klassenmethoden dauerhaft an Klasseninstanzen binden. Dieser Ansatz vereinfacht den Bindungsprozess und bietet eine prägnante und konsistente Syntax zum Definieren von Klassenmethoden in ES6.

Das obige ist der detaillierte Inhalt vonKönnen Pfeilfunktionen Klassenmethoden in ES6 dauerhaft binden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!