JavaScript Proxy is an object which intercepts another object and resists the fundamental operations on it. This object is mostly used when we want to hide information about one object from unauthorized access. A Proxy consists of two parts which are its target and handler. A target is a JavaScript object on which the proxy is applied and the handler object contains the function to intercept any other operation on it.
Syntax:
const prox = new Proxy(tar, handle)
Parameters: This object accepts two parameters.
- tar: It is the object on which the Proxy is to be applied
- handle: It is the object in which the intercept condition is defined
Returns: A proxy object.
Example 1: Here the method applies a Proxy object with an empty handler.
Javascript
let details = {    name: "Raj",    Course: "DSA",}const prox = new Proxy(details, {})Â
console.log(prox.name);console.log(prox.Course); |
Output:
Raj DSA
Example 2: Here the method applies a handler function to intercept calls on the target object.
Javascript
let details = {    name: "Raj",    Course: "DSA",}const prox = new Proxy(details, {    get: function(){        return "unauthorized"    }})Â
console.log(prox.name);console.log(prox.Course); |
Output:
unauthorized unauthorized
Example 3: Here the method traps calls on the target object based on the condition.
Javascript
let details = {    name: "Raj",    Course: "DSA",}const proxy = new Proxy(details, {    get: function(tar, prop){        if(prop == "Course"){            return undefined;        }        return tar[prop];    }});Â
console.log(proxy.name);console.log(proxy.Course); |
Output:
Raj undefined
Example 4: This example uses Proxy methods to delete properties.
Javascript
const courseDetail = {    name: "DSA",    time: "6 months",    status: "Ongoing",}Â
const handler = {Â Â deleteProperty(target, prop) {Â Â Â Â if (prop in target) {Â Â Â Â Â Â delete target[prop];Â Â Â Â Â Â console.log(`Removed: ${prop}`);Â Â Â Â }Â Â }};Â
const pro = new Proxy(courseDetail, handler);Â
console.log(pro.name);delete pro.nameconsole.log(pro.name); |
Output:
DSA Removed: name undefined
Supported Browsers:
- Chrome
- Edge
- Firefox
- Opera
- Safari
We have a complete list of JavaScript Proxy methods, to check please go through JavaScript Proxy/handler Reference article.
