Basic use cases for ES6 proxies

I recently learned about ES6 proxies, but I don't see a compelling reason to use it. What I mean is that anything that can be done with a proxy can be done without one, except when I'm missing something.

For example, most people talk about validation when it comes to proxy, but you can apply some JS goodwill to validate and you are fine. I would appreciate it if someone could open my eyes to some important use cases for Proxies. Thank you!

+4


source to share


5 answers


I mean, anything that can be done with a proxy can be done without it ...

This is not true.

Consider the general need to access properties that don't exist:

const o = {foo: "bar"};
console.log(o.blarg);

      

It is common practice to handle this in a way other than the default, which is logged undefined

. The proxy allows us to do this via get

trap
. Example:



const o = {foo: "bar"};
const p = new Proxy(o, {
  get(target, prop, receiver) {
    return prop in target ? target[prop] : "nifty!";
  }
});
console.log(p.foo);
console.log(p.blarg);
      

Run codeHide result


Another example is the ability to connect to various operations that get a list of object properties. There is no way to connect to this without a proxy. It's easy with a proxy: you use has

trap
or ownKeys

trap
depending on what you want to connect to.

In terms of other use cases: Proxies are the perfect tool for implementing the Facade pattern. Look for Facade use cases and you will find proxy use cases.

+13


source


You can actually handle it. Theres an awesome github report where this guy put together a bunch of proxy resources that you can check out.

https://github.com/mikaelbr/proxy-fun



Also, check my gists, I recently started playing with proxies and I have some examples that are quite unique. You can essentially create your own DSL using a proxy server and a program closer to what you think.

https://gist.github.com/jasuperior

+3


source


Proxies are a dynamic programming class (as in dynamic languages , not a solution method ) called metaprogramming , and it’s not at all the same that anything that can be done with proxies can be done without them. In fact, there really are reasons why proxies exist: to create entirely new capabilities that weren't possible before.

Proxies allow you to intercept operations on your objects that would otherwise be entirely responsible for the JavaScript engine; property access and mutation are two obvious examples.

TJ's answer is a good example of what you can't get around without a proxy. To give you another, I use proxies to include instances of single object object objects so that their backup data stores can be swapped out and replaced with brand new objects without affecting the references that point to those objects.

To do this without a proxy, we will need to iterate over all the fields of the object and change them for new fields in the new object. While it is true that JavaScript is dynamic enough to allow this to be possible, Proxies allow it to be solved in a more elegant way: the hidden backing store of the proxy is simply replaced with a new object, and all subsequent resource permissions are simply directed to the new backing store, not the old one. , while external references to an object (which is actually a proxy) shouldn't be any wiser. To them it seems like it is the same object (because it is), but now it has completely different data behind it.

This is just one example of what you can use Proxies for. They are very powerful because of how dynamic they are. I just recognize them, but I can already say that I am in love. :)

+2


source


If you are interested in VueJS:

VueJS 3.0 will use Proxy

to rewrite its system reactivity

, which is one of the most important parts in VueJS. One article for more details details

0


source


In ES6, Proxy offers the option to eat your cake and get it back. You don't need to know the properties to get / set in advance like in ES5. Now with ES6 Proxy, you can add a new property to an object, like this: The proxyObj.newProp = 9

Proxy will smile and set the new property without prejudice.

-1


source







All Articles