Heim > Artikel > Web-Frontend > Ausführliche Erläuterung der Anwendungsfälle für JS-Fassadenmuster
Dieses Mal werde ich Ihnen den Anwendungsfall des JS-Fassadenmodus ausführlich erläutern. Was sind die Vorsichtsmaßnahmen bei der Verwendung des JS-Fassadenmodus?
Fassadenmuster ist ein beliebtes Designmuster, das eine neue Schnittstelle für ein vorhandenes Objekt erstellt. Die Fassade ist ein brandneues Objekt, hinter dem ein bestehendes Objekt arbeitet. Fassaden werden manchmal auch Wrapper genannt. Sie nutzen unterschiedliche Schnittstellen, um vorhandene Objekte zu umhüllen. Wenn die Vererbung für Ihren Anwendungsfall nicht ausreicht, ist es logisch, dass der nächste Schritt die Erstellung einer Fassade sein sollte.
jQuery und YUI verwenden beide Fassaden für ihre DOM-Schnittstellen. Wie oben erwähnt, können Sie nicht von einem DOM-Objekt erben. Daher besteht die einzige Möglichkeit, ihm sicher Funktionalität hinzuzufügen, darin, eine Fassade zu erstellen. Hier ist ein Beispiel für einen DOM-Objekt-Wrapper-Code:
function DOMWrapper (element) { this.element = element; } DOMWrapper.prototype.addClass = function (className) { this.element.className += ' ' + className; } DOMWrapper.prototype.remove = function () { this.element.parentNode.removeChild(this.element); }// 用法var wrapper = new DOMWrapper( document .getElementById('my-div')); wrapper.addClass('selected'); wrapper.remove();
Der Typ DOMWrapper erwartet, dass ein DOM-Element an seinen Konstruktor übergeben wird. Das Element wird zur späteren Referenz gespeichert und definiert einige Methoden zur Bearbeitung des Elements. Die Methode addClass() ist eine einfache Möglichkeit, className zu Elementen hinzuzufügen, die das HTML5-Attribut classList noch nicht implementiert haben. Die Methode „remove()“ kapselt den Vorgang des Löschens eines Elements aus dem DOM und erspart Entwicklern so die Notwendigkeit, auf den übergeordneten Knoten des Elements zuzugreifen. Im Hinblick auf die Wartbarkeit von JS sind Fassaden eine sehr geeignete Methode. Sie können diese Schnittstellen vollständig steuern. Sie können den Zugriff auf die Eigenschaften oder Methoden jedes zugrunde liegenden Objekts zulassen und umgekehrt, wodurch der Zugriff auf dieses Objekt effektiv gefiltert wird. Sie können auch vorhandene Methoden ändern, um sie einfacher und benutzerfreundlicher zu machen (der obige Beispielcode ist ein Beispiel). Unabhängig davon, wie sich die zugrunde liegenden Objekte ändern, kann die Anwendung weiterhin normal funktionieren, solange die Fassade geändert wird.
Eine Fassade, die eine bestimmte Schnittstelle implementiert, um ein Objekt wie ein anderes Objekt aussehen zu lassen, wird als Adapter bezeichnet. Der einzige Unterschied zwischen Fassaden und Adaptern besteht darin, dass erstere neue Schnittstellen erstellt, während letztere vorhandene Schnittstellen implementiert.
Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!
Empfohlene Lektüre:
So vermeiden Sie Nullvergleiche in der WebentwicklungSo erkennen Sie Originalwerte im Web EntwicklungDas obige ist der detaillierte Inhalt vonAusführliche Erläuterung der Anwendungsfälle für JS-Fassadenmuster. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!