Why to use javascript proxy?

Recently, I was reading some less famous javascript feature and I found Javascript Proxy.

Before going into why, lets understand what is it. If you already know, feel free to skip few paragraphs.

Proxy is an object in javascript which wraps an object or a function and monitors it via something called target. Irrespective of the wrapped object or function existence. Proxy are similar to meta programming in other languages.

There are 3 key terms we need to understand before we proceed:

1. Targets : Object or Function to be proxied.
2. Handler : The function that do something on Object or Function that is proxied.
3. Traps : These are some functions used to work on targets. Click here to read more about traps.

Below is how we defined it

Syntax

We use Proxy Class from ES6, the arguments, target is the wrap object and handler will be the function used to do some action on target using traps.

Below is a simple example of its usage

Basic example for proxy

We made 2 objects called target and handler, target is a simple object with a message key and handler is an object that have a get key with a function associated with it. We pass 2 objects in proxy class and in return receive a proxy object by which we can access the message property of target object.

Here is an small example of how use it for validation of object values

Validation of object key’s

We use a empty object as a target object and a handler that take set trap on target object and do the validation. Pretty easy right!

Lets look into how we can use it to make API call wrapper.

We have used axios, and then created an instance with our baseURL, created a handler for proxy that return an object of get, post, put, delete, patch function to be used, and at last made an api object which is a proxy object to an empty object target.

We can then use it as :

Calling API proxy object

This can be extended doing validation, value correction, tracing property accesses, warning about unknown properties, negative Array indices, data binding, accessing a restful web service (method calls), revocable references, monitoring async functions, type checking and much more, Read here more

I personally found javascript proxy very use-full in restful web service, validation, monitoring async functions. I will explore more.

Side note: The examples used can be optimized.

This is my first article on medium 😃 or should i say a new journey of writing begins. 😄

I am happy to receive any feedback may be positive or negative.

If you like this article, please recommend and share to help others find it!