Curriculum
Module 30 // Core JavaScript
Property Descriptors
Module Objective
writable, enumerable, configurable, getters/setters, Object.defineProperty
Mental Model Realtime Simulation
INTERACTIVE_CANVASEditor_Pane
Loading...
Console_Output
Waiting for output...
Practical Code Examples
// Example 1
// 1. Making a Constant Property
const config = {};
Object.defineProperty(config, "API_KEY", {
value: "SECRET_123",
writable: false,
configurable: false
});
config.API_KEY = "HACKED"; // Silently fails (Error in strict mode)
console.log(config.API_KEY); // "SECRET_123"💡 By setting `writable: false`, you create a property that cannot be changed. This is how internal JS constants are often implemented.
// Example 2
// 2. Hidden Properties (Enumerable)
const user = { name: "Alex" };
Object.defineProperty(user, "internalId", {
value: 999,
enumerable: false // Hidden from loops
});
console.log(Object.keys(user)); // ["name"]
console.log(user.internalId); // 999 (Still accessible!)💡 Non-enumerable properties are useful for metadata that you don't want to show up in JSON serialization or `for...in` loops.
// Example 3
// 3. Object Freezing
const obj = { x: 10 };
Object.freeze(obj);
// Freezing sets all descriptors to writable: false
// and configurable: false for EVERY property.
obj.x = 20; // Fails💡 `Object.freeze()` is a high-level utility that uses property descriptors under the hood to make an object immutable.
Engine & Memory Architecture
Inside the Object
1. Descriptor Slots:
- In the Heap, every object property isn't just a value.
- It's a structure containing the Value and a bitmask of Flags (W, E, C).
2. Accessor Descriptors:
- Getters and Setters are stored as pointers to function objects in the Heap.
- When you access the property, the CPU doesn't just read memory; it executes the pointed-to function.
3. V8 Performance:
- Frequently changing descriptors can break the engine's "Hidden Classes" optimization.
- Rule: Define your descriptors once at creation time for maximum performance in the RAM.