DEV Community

shadowtime2000
shadowtime2000

Posted on • Edited on

2 2

Using JavaScript Proxies

In this post I will show you how to use a Proxy.

The concept of a proxy is pretty simple. You provide triggers that run when you are getting or setting something in an object.

// private user object
const _user = {
    name: "User",
    age: 25,
    _address: "A place"
}

const traps = {
    get(target, prop) {
        if (prop[0] === "_") {
            return undefined;
        }
    }
}

const user = new Proxy(_user, traps);

console.log(user.name) // User
console.log(user.age) // 25
console.log(user._address) // undefined
Enter fullscreen mode Exit fullscreen mode

As shown in the example above, Proxies can be used for stopping programs from accessing private variables.
They can also be used to stop programs from setting private variables.

// private user object
const _user = {
    name: "User",
    age: 25,
    _address: "A place"
}

const traps = {
    get(target, prop) {
        if (prop[0] === "_") {
            return undefined;
        }
    },
    set(target, prop, value) {
        if (prop[0] === "_") {
            return;
        } else {
            target[prop] = value;
        }
    }
}

const user = new Proxy(_user, traps);

user.name = "Person";
user.age = 26;

user._address = "In the world"; // Doesn't set
Enter fullscreen mode Exit fullscreen mode

You can read more about Proxies on the MDN.

Sentry blog image

How I fixed 20 seconds of lag for every user in just 20 minutes.

Our AI agent was running 10-20 seconds slower than it should, impacting both our own developers and our early adopters. See how I used Sentry Profiling to fix it in record time.

Read more

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs