Zoeken…


Invoering

Een proxy in JavaScript kan worden gebruikt om fundamentele bewerkingen op objecten te wijzigen. Proxy's werden geïntroduceerd in ES6. Een proxy op een object is zelf een object met vallen . Traps kunnen worden geactiveerd wanneer bewerkingen worden uitgevoerd op de proxy. Dit omvat het opzoeken van eigenschappen, het aanroepen van functies, het wijzigen van eigenschappen, het toevoegen van eigenschappen, enzovoort. Als er geen toepasselijke trap is gedefinieerd, wordt de bewerking uitgevoerd op het proxy-object alsof er geen proxy was.

Syntaxis

  • let proxied = new Proxy(target, handler);

parameters

Parameter Details
doelwit Het doelobject, acties op dit object (ophalen, instellen, enz ...) worden door de handler geleid
handler Een object dat "vallen" kan definiëren voor het onderscheppen van acties op het doelobject (ophalen, instellen, enz ...)

Opmerkingen

Een volledige lijst met beschikbare "vallen" is te vinden op MDN - Proxy - "Methods of the handler object" .

Zeer eenvoudige proxy (met behulp van de ingestelde val)

Deze proxy voegt eenvoudig de string " went through proxy" aan elke stringeigenschap die op het doelobject 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

Zoeken naar proxy-eigenschappen

Om het opzoeken van eigenschappen te beïnvloeden, moet de get handler worden gebruikt.

In dit voorbeeld wijzigen we het opzoeken van eigenschappen zodat niet alleen de waarde, maar ook het type van die waarde wordt geretourneerd. We gebruiken Reflect om dit te vergemakkelijken.

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
Licentie onder CC BY-SA 3.0
Niet aangesloten bij Stack Overflow