Recherche…


Introduction

Un proxy en JavaScript peut être utilisé pour modifier des opérations fondamentales sur des objets. Des proxies ont été introduits dans ES6. Un proxy sur un objet est lui-même un objet comportant des interruptions . Des interruptions peuvent être déclenchées lorsque des opérations sont effectuées sur le proxy. Cela inclut la recherche de propriétés, l'appel de fonctions, la modification de propriétés, l'ajout de propriétés, etc. Lorsqu'aucune interruption applicable n'est définie, l'opération est effectuée sur l'objet traité comme s'il n'y avait pas de proxy.

Syntaxe

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

Paramètres

Paramètre Détails
cible L'objet cible, les actions sur cet objet (get, setting, etc ...) seront acheminées via le gestionnaire
gestionnaire Un objet pouvant définir des "traps" pour intercepter des actions sur l'objet cible (get, setting, etc ...)

Remarques

Une liste complète des "traps" disponibles se trouve sur MDN - Proxy - "Méthodes de l'objet gestionnaire" .

Proxy très simple (en utilisant le trap trap)

Ce proxy ajoute simplement la chaîne " went through proxy" à chaque jeu de propriétés de chaîne de l' object cible.

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

Recherche de propriété de propriété

Pour influencer la recherche de propriété, le gestionnaire get doit être utilisé.

Dans cet exemple, nous modifions la recherche de propriétés afin que non seulement la valeur, mais également le type de cette valeur soit renvoyé. Nous utilisons Reflect pour faciliter cela.

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
Sous licence CC BY-SA 3.0
Non affilié à Stack Overflow