What is a "property descriptor"?

JavaScriptMiddle~1 min read

A property descriptor is a description object that specifies exactly how an object's property behaves: whether it can be changed, deleted, enumerated, and so on.

It is internal "meta-information" about every property in JavaScript.

Briefly

Every property in JS has a descriptor - an object with service flags that define its behavior.

You can get the descriptor using:

javascript

Object.getOwnPropertyDescriptor(obj, key)

Example

javascript

const user = { name: 'Tim' };

const descriptor = Object.getOwnPropertyDescriptor(user, 'name');
console.log(descriptor);

It will print roughly:

javascript

{
  value: 'Tim',
  writable: true,
  enumerable: true,
  configurable: true
}

This is a data descriptor, and it shows:

value - the property's value;
writable - whether the value can be changed;
enumerable - whether it shows up during enumeration (for...in, Object.keys());
configurable - whether it can be deleted or reconfigured.

There are 2 types of descriptors

1. Data descriptor (for regular properties)

Uses the fields:

value
writable
enumerable
configurable

Example:

javascript

Object.defineProperty(user, 'age', {
  value: 25,
  writable: false,
  enumerable: true,
  configurable: false
});

2. Accessor descriptor (for getters/setters)

Uses the fields:

get - the getter function;
set - the setter function;
enumerable
configurable

Example:

javascript

const person = {};
Object.defineProperty(person, 'fullName', {
  get() {
    return 'Tim Brown';
  },
  enumerable: true,
  configurable: true
});

console.log(person.fullName); // "Tim Brown"

Such properties have no value and writable, but they do have access functions.

How to set your own descriptor

Using:

javascript

Object.defineProperty(obj, key, descriptor)

Example:

javascript

const user = {};

Object.defineProperty(user, 'name', {
  value: 'Tim',
  writable: false,
  enumerable: true,
  configurable: false
});

console.log(user.name); // "Tim"
user.name = 'Oleh';     // won't change
console.log(user.name); // "Tim"

writable: false makes the property read-only.

Let's check the flag properties

Flag	What it does	Default
`value`	Property value	`undefined`
`writable`	Whether `value` can be changed	`false`
`enumerable`	Whether it participates in enumeration	`false`
`configurable`	Whether it can be deleted/redefined	`false`

Example of the `enumerable` difference

javascript

const user = {};
Object.defineProperty(user, 'secret', {
  value: '12345',
  enumerable: false
});

console.log(user.secret);         // accessible directly
console.log(Object.keys(user));   // []
for (const key in user) console.log(key); // prints nothing

enumerable: false hides the property during traversal.

Example with `configurable`

javascript

const user = {};
Object.defineProperty(user, 'id', {
  value: 10,
  configurable: false
});

delete user.id; // won't be deleted

How to get all descriptors

javascript

const user = { name: 'Tim', age: 25 };
console.log(Object.getOwnPropertyDescriptors(user));

It will print an object with descriptors of all properties.

Summary

Type	Keys	Example
Data descriptor	`value`, `writable`, `enumerable`, `configurable`	regular property
Accessor descriptor	`get`, `set`, `enumerable`, `configurable`	getter/setter

Short Answer

Interview ready

Premium

A concise answer to help you respond confidently on this topic during an interview.