Detaillierte Erklärung des Prinzips des js-Proxys

Detaillierte Erklärung des Prinzips des js-Proxys

Was ist der Proxy-Modus?

Einführung eines Beispiels aus der Praxis

Müssen wir als Nutzer eine Reihe langwieriger Dinge herausfinden, beispielsweise wie man die Qualität eines Hauses bewertet, wie man die Verfahren zur Wohnungssuche durchführt usw.? Natürlich möchten Benutzer dies nicht tun. Was den Nutzern am wichtigsten ist, ist das Ergebnis. Nutzer können ein zufriedenstellendes Haus erhalten, indem sie Ansprüche an das Haus stellen und Geld in gleichem Wert bereitstellen. Dies ist das Ergebnis.

Wer also löst den langwierigen Hauskaufprozess für die Nutzer? Natürlich ist es der „Immobilienmakler“! Die Rolle eines Immobilienmaklers besteht in der Erbringung von Bewertungs-, Transaktions-, Vermittlungs-, Beratungs- und sonstigen Dienstleistungen sowie After-Sales-Services für die Transaktionsobjekte auf dem Angebots- und Nachfragemarkt für die Entwicklung, den Betrieb und den Verbrauch von Immobilien.

Verstehen Sie die Definition des Proxy-Modells anhand von Beispielen

In manchen Fällen ist es nicht sinnvoll oder möglich, dass ein Objekt direkt auf ein anderes Objekt verweist, und ein Proxy-Objekt kann als Vermittler zwischen dem Client und dem Zielobjekt fungieren.

Das Agenturmodell dient dazu, eine Art Agent für andere Benutzer bereitzustellen. Benutzer müssen den spezifischen Prozess des Hauskaufs nicht kennen. Was die Benutzer interessieren sollte, ist, wie sie zufriedenstellende Ergebnisse erzielen. Was der Agent tun muss, ist, den Prozess des Hauskaufs abzuschließen.

Was ist ein Proxy

Proxy unterstützt viele Abfangoperationen, derzeit werden nur get(target, propKey, receiver) und set(target, propKey, value, receiver) erwähnt.

  • Get-Methode: fängt das Lesen von Objektattributen ab;
  • Set-Methode: Abfangen der Einstellung von Objekteigenschaften.

get(Ziel, Eigenschaftenschlüssel, Empfänger)

Definieren Sie ein Personenobjekt, das von Proxy weitergeleitet wird. Die Außenwelt greift über das Proxy-Instanzobjekt auf das Personenobjekt zu.

var Person = {
    Name: "kongsam",
    Alter: 21,
    Hobbys:
        "Anime schauen",
        "Radfahren",
        "Spiele spielen"
    ]
}

Instanziieren Sie ein Proxy-Objekt, um externe Vorgänge am Personenobjekt abzufangen.

var Proxy = neuer Proxy (Person, {
    get: Funktion (Ziel, Eigenschaft) {
          // Ziel und Eigenschaft drucken, um zu sehen, was sich darin befindet.
          konsole.log("ziel = ", ziel);
          console.log("Eigenschaft = ", Eigenschaft);
          // Bestimmen Sie, ob das von der Außenwelt aufgerufene Objektattribut im Zielobjekt vorhanden ist.
          if (Eigenschaft im Ziel) {
                Ziel [Eigenschaft] zurückgeben;
          } anders {
                // Wenn die von der Außenwelt aufgerufene Objekteigenschaft im Zielobjekt nicht vorhanden ist, wird eine Ausnahme ausgelöst.
                throw new ReferenceError('Eigenschaft "' + Eigenschaft + '" existiert nicht.');
          }
    },
});

Da beim Ausführen der Operation „proxy.name“ das Person-Objekt durch Proxy weitergeleitet wurde, wird immer, wenn ich über das Proxy-Instanzobjekt auf die in Person vorhandenen Attribute zugreife, die Methode „get“ aufgerufen, und die Methode „get“ fängt das Lesen der Objektattribute ab.

Die von den beiden Parametern Ziel und Eigenschaft in get: Funktion (Ziel, Eigenschaft) empfangenen Informationen sind in der Abbildung dargestellt

Beim Zugriff auf die Eigenschaften, die im Personenobjekt vorhanden sind, über das Proxy-Objekt tritt keine Ausnahme auf. Was passiert, wenn Sie auf die nicht vorhandenen Eigenschaften zugreifen?

Warum wird beim Zugriff auf eine nicht vorhandene Eigenschaft eine Ausnahme ausgelöst?

Dies liegt daran, dass jeder Zugriff auf das Personenobjekt von der Außenwelt zuerst die vom Proxy festgelegte Abfangschicht durchlaufen muss und die Abfangschicht einen Mechanismus zum Filtern und Umschreiben des Zugriffs von der Außenwelt bereitstellt.

// Bestimmen Sie, ob das von der Außenwelt aufgerufene Objektattribut im Zielobjekt vorhanden ist.
if (Eigenschaft im Ziel) {
    Ziel [Eigenschaft] zurückgeben;
} anders {
    // Wenn die von der Außenwelt aufgerufene Objekteigenschaft im Zielobjekt nicht vorhanden ist, wird eine Ausnahme ausgelöst.
    throw new ReferenceError('Eigenschaft "' + Eigenschaft + '" existiert nicht.');
}

Die if-Anweisung ist die spezifische Operation der Abfangschicht, die darin besteht, externe Zugriffe zu filtern und neu zu schreiben. Wenn nicht, wird beim Zugriff auf eine nicht vorhandene Eigenschaft „undefined“ zurückgegeben.

setze(Ziel, Eigenschaftenschlüssel, Wert, Empfänger)

Es ist immer noch ein Personenobjekt. Jetzt habe ich eine neue Anforderung. Beim Ändern des Altersattributs darf der Wert 150 nicht überschreiten und muss eine Ganzzahl sein.

Set-Methode im Proxy-Objekt hinzugefügt.

var Proxy = neuer Proxy (Person, {
    set: Funktion (Ziel, Eigenschaft, Wert) {
          // Ziel, Eigenschaft und Wert drucken, um den Inhalt zu sehen.
          konsole.log("ziel = ", ziel);
          console.log("Eigenschaft = ", Eigenschaft);
          console.log("Wert = ", Wert);
          if (Eigenschaft === "Alter") {
                wenn (!Number.isInteger(value)) {
                  throw new TypeError("Der Wert von age ist keine Ganzzahl!");
                }
                wenn (Wert > 150) {
                  throw new RangeError("Alter kann nicht größer als 150 sein!");
                }
          }
    },
});

Wenn ich proxy.age = 100 ausführe, werden die von den drei Parametern des Sets empfangenen Informationen in der folgenden Abbildung angezeigt.

Die Set-Methode wird verwendet, um die Zuweisungsoperation eines bestimmten Attributs abzufangen. Was passiert, wenn die Zuweisungsoperation des Alters die Bedingungen nicht erfüllt?

Offensichtlich wird eine Ausnahme ausgelöst.

Zusammenfassen

Proxy ist eine Abfangschicht. Sie geben das abgefangene Objekt an, und die Außenwelt muss zuerst die Abfangschicht passieren, um auf dieses Objekt zuzugreifen, d. h. auf das Instanzobjekt von Proxy zugreifen. Proxys dienen zum Filtern und Umschreiben von externen Zugriffen, beispielsweise müssen bei der Wertevergabe gewisse Voraussetzungen erfüllt sein.

Es gibt viele andere Methoden im Proxy-Objekt, wie z. B. has, deleteProperty, ownKeys, getOwnPropertyDescriptor usw., die zum Abfangen verschiedener Situationen verwendet werden.

Oben finden Sie eine ausführliche Erklärung des Prinzips von js Proxy. Weitere Informationen zu js Proxy finden Sie in den anderen verwandten Artikeln auf 123WORDPRESS.COM!

Das könnte Sie auch interessieren:
  • Proxy-Objekt in JavaScript
  • JS führt Sie tief in die Welt von Proxy
  • Spezifische Verwendung von ES6-Proxy in JavaScript
  • Welche interessanten Dinge kann JavaScript Proxy tun?
  • Detaillierte Erklärung des JavaScript-Proxy-Objekts

<<:  So installieren Sie Graphviz und beginnen mit dem Tutorial unter Windows

>>:  Detaillierte Schritte zur Installation und Konfiguration von MySQL 8.0 auf CentOS 7.4 64-Bit

Artikel empfehlen

Notieren Sie eine Falle bei der Aktualisierung der MySQL-Update-Anweisung

Hintergrund Kürzlich habe ich während eines Onlin...

Kostenlose Installationskonfigurationsmethode für MySQL 5.7.18 WinX64

1. Herunterladen 2. Dekompression 3. Fügen Sie di...

Detaillierte Schritte zur Entwicklung von WeChat-Miniprogrammen mit Typescript

Auf die Vorteile von Typescript müssen wir nicht ...

So zeichnen Sie spezielle Grafiken in CSS

1. Dreieck Rahmeneinstellungen Code: Breite: 300p...

Vue implementiert Dialogkapselung

Inhaltsverzeichnis Vue2-Schreiben Schreiben der V...

MySQL-Triggerprinzip und Analyse von Anwendungsbeispielen

Dieser Artikel erläutert anhand von Beispielen di...

Der Unterschied zwischen ID- und Name-Attributen von HTML-Elementen

Heute bin ich etwas verwirrt über <a href="...

Das Laufschrift-Tag in HTML erzielt einen nahtlosen Laufschrift-Effekt

Das <marquee>-Tag ist ein Tag, das paarweis...