Heim > Web-Frontend > js-Tutorial > Hauptteil

So greifen Sie über den Funktionsaufruf auf eine Klasseninstanz zu, wenn Sie Funktionen mit ES6-Klassen erweitern

Linda Hamilton
Freigeben: 2024-10-21 06:03:30
Original
633 Leute haben es durchsucht

How to Access Class Instance from Function Invocation when Extending Functions with ES6 Classes

Funktionen mit ES6-Klassen erweitern

In ES6 haben Programmierer die Möglichkeit, spezielle Objekte, einschließlich Funktionen, zu erweitern. Durch den Einsatz von Vererbung wird es möglich, Klassen aus Funktionen abzuleiten. Während diese erweiterten Objekte wie Funktionen aufgerufen werden können, kann die Implementierung der entsprechenden Logik für diese Aufrufe eine Herausforderung darstellen.

In diesem Szenario stellt sich eine wichtige Frage: Wie erhält man einen Verweis auf die Klasseninstanz, wenn das Objekt aufgerufen wird? als Funktion, wenn man bedenkt, dass reguläre Methoden darüber Zugriff erhalten? Leider verweist dieser Verweis in diesen Fällen auf das globale Objekt (Fenster).

Lösung:

Um dieses Problem anzugehen, kann man das Konzept der Abschlüsse anwenden Erstellen einer zurückgegebenen Funktion, die den Zugriff auf Instanzvariablen kapselt. Hier ist eine Illustration:

class Smth extends Function {
  constructor(x) {
    super(() => { return x; });
  }
}
Nach dem Login kopieren

In diesem Beispiel initiiert der Super-Ausdruck im Konstruktor den Funktionskonstruktor und erfordert eine Zeichenfolge, die den auszuführenden Code darstellt. Der Zugriff auf Instanzdaten ist jedoch nicht einfach, daher wird ein fest codierter Ansatz gewählt, der zum gewünschten Ergebnis führt:

console.log((new Smth(256))()); // Logs: 256
Nach dem Login kopieren

Ein alternativer Ansatz zum Erreichen des gleichen Ziels besteht darin, die Prototypenkette zu manipulieren:

class Smth extends Function {
  constructor(x) {
    const smth = function() { return x; };
    Object.setPrototypeOf(smth, Smth.prototype);
    return smth;
  }
}
Nach dem Login kopieren

Diese Methode bietet mehr Flexibilität, da die zurückgegebene Funktion ein Abschluss sein kann, der auf Instanzvariablen zugreifen kann.

Darüber hinaus ist es möglich, diese Funktionalität in ein wiederverwendbares Dienstprogramm zu abstrahieren:

class ExtensibleFunction extends Function {
  constructor(f) {
    return Object.setPrototypeOf(f, new.target.prototype);
  }
}

class Smth extends ExtensibleFunction {
  constructor(x) {
    super(() => { return x; });
  }
}
Nach dem Login kopieren

Dieser Ansatz schafft eine zusätzliche Indirektionsebene in der Vererbungshierarchie, kann jedoch in bestimmten Szenarien von Vorteil sein. Darüber hinaus kann man dies vermeiden, indem man das folgende Konstrukt verwendet:

function ExtensibleFunction(f) {
  return Object.setPrototypeOf(f, new.target.prototype);
}
ExtensibleFunction.prototype = Function.prototype;
Nach dem Login kopieren

Bitte beachten Sie jedoch, dass Smth in diesem Fall statische Funktionseigenschaften nicht dynamisch erbt.

Das obige ist der detaillierte Inhalt vonSo greifen Sie über den Funktionsaufruf auf eine Klasseninstanz zu, wenn Sie Funktionen mit ES6-Klassen erweitern. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!