How to use JavaScript Object.defineProperty?

The Object.defineProperty() method allows you to define a new property or modify an existing property on an object with precise control over its behavior.

Syntax

Object.defineProperty(obj, prop, descriptor)

Parameters

  • obj - The object on which to define the property
  • prop - The name of the property to be defined or modified
  • descriptor - An object that describes the property's attributes

Property Descriptor Attributes

The descriptor object can contain the following attributes:

  • value - The value of the property
  • writable - Whether the property can be changed (default: false)
  • enumerable - Whether the property shows up in for...in loops (default: false)
  • configurable - Whether the property can be deleted or modified (default: false)

Example: Basic Property Definition

<!DOCTYPE html>
<html>
   <body>
      <script>
         const obj = {};

         Object.defineProperty(obj, 'prop', {
            value: 20,
            writable: false
         });
         
         obj.prop = 10; // This won't change the value
         document.write("Property value: " + obj.prop);
      </script>
   </body>
</html>

Example: Property with Getter and Setter

<!DOCTYPE html>
<html>
   <body>
      <script>
         const person = {};
         let name = '';

         Object.defineProperty(person, 'fullName', {
            get: function() {
               return name;
            },
            set: function(value) {
               name = value.toUpperCase();
            },
            enumerable: true,
            configurable: true
         });

         person.fullName = 'john doe';
         document.write("Full name: " + person.fullName);
      </script>
   </body>
</html>

Example: Non-enumerable Property

<!DOCTYPE html>
<html>
   <body>
      <script>
         const user = { age: 25 };

         Object.defineProperty(user, 'secret', {
            value: 'hidden data',
            enumerable: false
         });

         document.write("Age property: " + user.age + "<br>");
         document.write("Secret property: " + user.secret + "<br>");
         document.write("Keys: " + Object.keys(user)); // Only shows 'age'
      </script>
   </body>
</html>

Comparison of Descriptor Attributes

Attribute Default Value Description
value undefined The property's value
writable false Can the value be changed?
enumerable false Shows in Object.keys() and for...in?
configurable false Can be deleted or redefined?

Key Points

  • Properties defined with Object.defineProperty() are non-writable, non-enumerable, and non-configurable by default
  • You cannot use both value/writable and get/set in the same descriptor
  • Useful for creating constants, computed properties, and controlling property behavior

Conclusion

Object.defineProperty() provides fine-grained control over object properties. Use it when you need to create properties with specific behaviors like read-only values or computed properties with getters and setters.

Updated on: 2026-03-15T23:18:59+05:30

313 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements