Wie kann ich den Wert „this' beibehalten, wenn ich prototypbasierten JavaScript-Code organisiere?

Code-Organisation und der „diese“-Wert in objektorientiertem JavaScript

Bei der Organisation von prototypbasiertem JavaScript-Code entsteht eine häufige Herausforderung Beibehaltung von Objektreferenzen und Vererbung. Angenommen, Sie haben eine Carousel-Klasse mit verschiedenen Funktionen wie next(), prev() und bindControls(). Um die Codeorganisation zu verbessern, möchten Sie diese Funktionen wie folgt unter einer Steuereigenschaft gruppieren:

Carousel.prototype.controls = {
   next: function () { ... } , 
   prev: function() { ... },
   bindControls: function () { .. }
};

Dieser Ansatz stört jedoch den „this“-Wert, der für den Zugriff auf Objekteigenschaften und -methoden von entscheidender Bedeutung ist. Um den „this“-Wert im ursprünglichen Kontext beizubehalten, können Sie die folgende Lösung übernehmen:

Erstellen Sie eine Controls-Klasse, die einen Verweis auf das steuerbare Objekt im Controls-Konstruktor behält. Die Methode in Controls, die Aktionen wie next() verarbeitet, verwendet die Referenz, um die entsprechende Methode im steuerbaren Objekt aufzurufen.

var Controls = function (controllable_object) {
    this.ref = controllable_object;
};
Controls.prototype.next = function () {
    this.ref.foo();
}
// ..

var Carousel = function () {
    this.controls = new Controls(this);
};
// ..

Dies stellt die Vererbung sicher und ermöglicht es Ihnen, die Implementierung von Controls durch a zu überschreiben Mechanismus wie Abhängigkeitsinjektion.

Das obige ist der detaillierte Inhalt vonWie kann ich den Wert „this' beibehalten, wenn ich prototypbasierten JavaScript-Code organisiere?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!