JavaScript peut-il implémenter des getters/setters dynamiques ?

Les getters et setters dynamiques permettent aux objets JavaScript de gérer l'accès et la modification des propriétés au-delà des propriétés prédéfinies. Alors que les techniques JavaScript antérieures utilisaient des getters et des setters spécifiques pour les propriétés connues, cet article explore la possibilité d'implémenter des getters et des setters fourre-tout pour toutes les propriétés non définies.

Proxy ES2015 : une solution dynamique

ES2015 a introduit les proxys JavaScript, qui permettent la création d'objets servant d'intermédiaires pour d'autres objets. Cette fonctionnalité ouvre des getters et setters dynamiques :

const original = {
    example: "value",
};
const proxy = new Proxy(original, {
    get(target, name, receiver) {
        if (Reflect.has(target, name)) {
            let rv = Reflect.get(target, name, receiver);
            if (typeof rv === "string") {
                rv = rv.toUpperCase();
            }
            return rv;
        }
        return "missing";
    },
});

console.log(`proxy.example = ${proxy.example}`); // "proxy.example = VALUE"
console.log(`proxy.unknown = ${proxy.unknown}`); // "proxy.unknown = missing"

Dans cet exemple, l'objet proxy intercepte l'accès aux propriétés de l'objet d'origine. Lors de l'accès à une propriété de chaîne, le proxy la convertit en majuscules et la renvoie ; pour les propriétés inconnues, il renvoie « manquant » au lieu de non défini.

Cette implémentation est compatible avec tous les navigateurs si le navigateur prend en charge ES2015 (ES6). Pour les navigateurs plus anciens, envisagez d'utiliser des polyfills ou des techniques alternatives. Les proxys fournissent une solution flexible pour les getters et setters dynamiques, permettant une gestion efficace des propriétés et une introspection des propriétés sans modifier l'objet d'origine.