JavaScript Handler defineProperty() Method

0 0 2 minutes read

JavaScript handler.defineProperty() method in Javascript is used to define the new properties and to modify the existing properties directly on an object. It is a trap for Object.defineProper().

Syntax:

const p = new Proxy(target, {
      defineProperty: function(target, property, descriptor) {
  }
});

Parameters: This method accepts three parameters as mentioned above and described below:

Target: This parameter holds the target object.
property: This parameter is the name or Symbol of the property whose description is going to be retrieved..
descriptor: This parameter is the descriptor for the property being defined or modified.

Return value: This method returns a Boolean value which is used to indicate if the property is successfully defined.

Below example illustrates the handler.defineProperty() method in JavaScript:

Example 1: In this example, we will see the use of the handler.defineProperty() method in JavaScript.

javascript

const p = new Proxy({}, {
    defineProperty: function (target, prop, descriptor) {
        console.log('Type : ' + prop);
        return true;
    }
});
 
const desc = { configurable: true, enumerable: true, value: 10 };
Object.defineProperty(p, 'String', desc);
 
let xyz = {};
let proxy = new Proxy(xyz, {
    defineProperty: function (target, name, propertyDescriptor) {
        console.log('in defineProperty');
        return Object.defineProperty(target, name, propertyDescriptor);
    }
});
Object.defineProperty(proxy, 'bar', {});

Output:

"Type : String"
"in defineProperty"

Example 2: In this example, we will see the use of the handler.defineProperty() method in JavaScript.

javascript

const handler1 = {
    defineProperty(target, key, descriptor) {
        invariant(key, 'define');
        return true;
    }
};
 
function invariant(key, action) {
    if (key[0] === '_') {
        throw new Error(
            `Invalid attempt to ${action} private "${key}" property`);
    }
}
 
const monster1 = {};
const proxy1 = new Proxy(monster1, handler1);
 
console.log(proxy1._propt = 'Handler defineProperty');

Output:

Error: Invalid attempt to define private "_propt" property

Supported Browsers: The browsers supported by handler.defineProperty() method are listed below:

Google Chrome 49 and above
Firefox 18 and above
Opera 36 and above
Safari 10 and above
Edge 12 and above

We have a complete list of Javascript Proxy/handler methods, to check those go through the Javascript Proxy/handler Reference article.

Whether you’re preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, zambiatek Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we’ve already empowered, and we’re here to do the same for you. Don’t miss out – check it out now!