Proxy

In java script, proxies helps to create copies of any object and it can be used to modify Fundamental operations of that time.

It is mainly used when we wanna to secure any key-value pair of any object from unauthorized access.

A proxy consists of two parts:

• target: object on which the proxy is applied.

• handler: object in which the intercept(changing/modified) condition is defined.

And it’s basic syntax looks like this:

let person = {
    "name" : "Naman",
    "address" : "abc",
    "password" : 987654321,
}

const proxiedPerson = new Proxy(person,{})

console.log(proxiedPerson)

In which the first parameter “person” of new proxy is the target and the empty object is the handler.

Let’s make a basic proxy which returns “unauthorized”, if we try to access his password:

let person = {
    "name" : "Naman",
    "address" : "abc",
    "password" : 987654321,
}

const proxiedPerson = new Proxy(person,{
    get : function(target,property){
        if (property === "password"){
            return "Unauthorized"
        }
        else{
            return target[property];
        }
    }
})

console.log(proxiedPerson)
console.log(proxiedPerson.name)
console.log(proxiedPerson.password)

where the first parameter of “new Proxy” is the target and the handler is an object, now we can use either “get” or “set” attribute, like I used “get” attribute which only have two arguments: target and property and in the function, the target parameter is referring towards the targeted object and the “property” is referring towards the properties or key-value pair that we tried to access of the targeted object.

Let’s take example of the separate handler object which will just the deletes the property:

let person = {
    "name" : "Naman",
    "address" : "abc",
    "password" : 987654321,
}

const handler = {
    get:function(target,property){
        if (property in target){
            delete target[property];
             return `Removed: ${property}`
        }
    }
}
const proxiedPerson = new Proxy(person,handler)

console.log(proxiedPerson)
console.log(proxiedPerson.name)
console.log(proxiedPerson.password)

where we created an independent handler named “handler”. that gets target and property and checks whether that property is present in target and then he deletes the property and returns that this property is deleted. and finally we added the “handler” in our proxied object.

Now let’s take an example of the “set” attribute, where we had to activate negative indexing of an array like this:

let array1 = [1,2,3,4,5,6,8,9]
// console.log(array1[-1])

in Java script and “set” attribute have these 3 arguments: target, property and value. Let’s use them:

const array1 = [1,2,3,4,5,6,7,8,9]

function proxiedArray(array, index){
    return new Proxy(array,{
        get:function(target,property){
            if (Number(property) < 0){
                return target[target.length+Number(property)]
            }
            else{
                return target[Number(property)]
            }
        },
        set:function(target,property,value){
            let index = Number(property);
            if (index < 0){
                target[target.length+index] = value
            }
            else {
                target[index] = value
            }
            return true;
        }
    })
}
proxiedArray = proxiedArray(array1)
console.log(proxiedArray[0])
console.log(proxiedArray[5])
console.log(proxiedArray[-5])

I know the code is too long but let me explain you. Firstly we created an function with “array” and “index” as parameter and then we returned our Proxy, then we used the get function to return the negative index and then we used set to set the negative index values.

---

Hope you found reading this blog helpful. Make sure to hit on the like icon only if you found this helpful otherwise make sure to hit on the dislike icon. Meet you on next blog, till that, Have a Good day.