JavaScript => Proxy

Einführung

Ein Proxy in JavaScript kann verwendet werden, um grundlegende Operationen an Objekten zu ändern. Proxies wurden in ES6 eingeführt. Ein Proxy für ein Objekt ist selbst ein Objekt, das Traps enthält . Traps können ausgelöst werden, wenn Operationen auf dem Proxy ausgeführt werden. Dazu gehören das Nachschlagen von Eigenschaften, das Aufrufen von Funktionen, das Ändern von Eigenschaften, das Hinzufügen von Eigenschaften usw. Wenn kein anwendbarer Trap definiert ist, wird die Operation für das übergebene Objekt so ausgeführt, als ob kein Proxy vorhanden wäre.

Syntax

let proxied = new Proxy(target, handler);

Parameter

Parameter	Einzelheiten
Ziel	Das Zielobjekt, die Aktionen für dieses Objekt (Abrufen, Festlegen usw.) werden durch den Handler geleitet
Handler	Ein Objekt, das "Traps" definieren kann, um Aktionen auf dem Zielobjekt abzufangen (Abrufen, Festlegen usw.).

Bemerkungen

Eine vollständige Liste der verfügbaren "Traps" finden Sie auf MDN-Proxy - "Methoden des Handler-Objekts" .

Sehr einfacher Proxy (mit dem Set Trap)

Dieser Proxy hängt einfach die Zeichenfolge " went through proxy" an jede String-Eigenschaft an, die für das Zielobjekt festgelegt object .

let object  = {};

let handler = {
    set(target, prop, value){ // Note that ES6 object syntax is used
        if('string' === typeof value){
            target[prop] = value + " went through proxy";
        }
    }
};

let proxied = new Proxy(object, handler);

proxied.example = "ExampleValue";

console.log(object); 
// logs: { example: "ExampleValue went trough proxy" }
// you could also access the object via proxied.target

Suche nach Eigenschaften

Um die Eigenschaftssuche zu beeinflussen, muss der get Handler verwendet werden.

In diesem Beispiel ändern wir die Eigenschaftssuche, sodass nicht nur der Wert, sondern auch der Typ dieses Werts zurückgegeben wird. Wir verwenden Reflect , um dies zu erleichtern.

let handler = {
    get(target, property) {
        if (!Reflect.has(target, property)) {
            return {
                value: undefined,
                type: 'undefined'
            };
        }
        let value = Reflect.get(target, property);
        return {
            value: value,
            type: typeof value
        };
    }
};

let proxied = new Proxy({foo: 'bar'}, handler);
console.log(proxied.foo); // logs `Object {value: "bar", type: "string"}`

Modified text is an extract of the original Stack Overflow Documentation

Lizenziert unter CC BY-SA 3.0

Nicht angeschlossen an Stack Overflow

JavaScript
Proxy

Suche…