hardFrontend EngineerTechnology
How do JavaScript Proxy and Reflect work, and what are practical use cases?
Posted 18/04/2026
by Mehedy Hasan Ador
Question Details
At a framework company: "We want reactive state that auto-triggers re-renders when properties change. How do Proxy and Reflect enable this?"
Suggested Solution
Proxy intercepts object operations
const reactive = new Proxy({ count: 0 }, {
get(target, key) { console.log(`Read: ${key}`); return Reflect.get(target, key); },
set(target, key, value) { console.log(`Write: ${key} = ${value}`); Reflect.set(target, key, value); scheduleRerender(); return true; }
});
reactive.count; // "Read: count"
reactive.count = 5; // "Write: count = 5", triggers rerender
| Use Case | How Proxy Helps |
|---|---|
| Validation | Intercept set, validate before writing |
| Reactivity | Track reads/writes for re-rendering |
| Default values | Return defaults for missing properties |
| API client | api.users.getById(1) → /users/1 |
Reflect provides default behavior for proxy traps — always delegate to it.