JavaScript Proxy & Reflect Interview Questions

Creating a Proxy

const target = { name: 'Alice', age: 30 }

const handler = {
  get(target, key, receiver) {
    console.log(`Reading: ${key}`)
    return Reflect.get(target, key, receiver)  // default behavior
  },
  set(target, key, value, receiver) {
    console.log(`Writing: ${key} = ${value}`)
    return Reflect.set(target, key, value, receiver)
  }
}

const proxy = new Proxy(target, handler)

proxy.name        // logs "Reading: name" → 'Alice'
proxy.age = 31    // logs "Writing: age = 31"
proxy.name        // 'Alice' — target was modified

// The proxy IS the interface — callers use proxy, not target
// target and proxy stay in sync because Reflect passes operations through

All 13 traps — what each intercepts

const fullHandler = {
  get(target, key, receiver) {},           // target[key], target.key
  set(target, key, value, receiver) {},    // target[key] = value
  has(target, key) {},                     // key in target
  deleteProperty(target, key) {},          // delete target[key]
  apply(target, thisArg, args) {},         // target(...args) — function calls
  construct(target, args, newTarget) {},   // new target(...args)
  getPrototypeOf(target) {},               // Object.getPrototypeOf(target)
  setPrototypeOf(target, proto) {},        // Object.setPrototypeOf(target, proto)
  isExtensible(target) {},                 // Object.isExtensible(target)
  preventExtensions(target) {},            // Object.preventExtensions(target)
  getOwnPropertyDescriptor(target, key){}, // Object.getOwnPropertyDescriptor(target, key)
  defineProperty(target, key, desc) {},    // Object.defineProperty(target, key, desc)
  ownKeys(target) {},                      // Object.keys(), for...in, Object.getOwnPropertyNames()
}

Validation — the most practical use case

function createTypedObject(schema) {
  return new Proxy({}, {
    set(target, key, value) {
      if (!(key in schema)) {
        throw new TypeError(`Unknown property: ${key}`)
      }
      if (typeof value !== schema[key]) {
        throw new TypeError(`${key} must be ${schema[key]}, got ${typeof value}`)
      }
      return Reflect.set(target, key, value)
    }
  })
}

const user = createTypedObject({ name: 'string', age: 'number' })
user.name = 'Alice'   // ✓
user.age  = 30        // ✓
user.age  = '30'      // ✗ TypeError: age must be number, got string
user.role = 'admin'   // ✗ TypeError: Unknown property: role

Default values — the get trap

// Return a default value for missing properties instead of undefined
const withDefaults = new Proxy({}, {
  get(target, key) {
    return key in target ? target[key] : `[missing: ${key}]`
  }
})

withDefaults.name   // '[missing: name]'
withDefaults.x = 1
withDefaults.x      // 1

// Deeply nested access without null checks:
function deepProxy(obj = {}) {
  return new Proxy(obj, {
    get(target, key) {
      if (key in target) return target[key]
      return deepProxy()  // return another proxy for chaining
    }
  })
}

const config = deepProxy({ db: { host: 'localhost' } })
config.db.host         // 'localhost'
config.db.port         // Proxy {} — no error, keeps chaining
config.missing.deeply.nested  // Proxy {} — never throws

Logging and debugging — the observability trap

function createObservable(target, onChange) {
  return new Proxy(target, {
    set(target, key, value) {
      const oldValue = target[key]
      const result = Reflect.set(target, key, value)
      if (oldValue !== value) {
        onChange({ key, oldValue, newValue: value })
      }
      return result
    },
    deleteProperty(target, key) {
      const oldValue = target[key]
      const result = Reflect.deleteProperty(target, key)
      onChange({ key, oldValue, newValue: undefined, deleted: true })
      return result
    }
  })
}

const state = createObservable({ count: 0 }, change => {
  console.log('State changed:', change)
})

state.count = 1   // State changed: { key: 'count', oldValue: 0, newValue: 1 }
state.count = 1   // No log — value didn't change
delete state.count // State changed: { key: 'count', oldValue: 1, deleted: true }

The apply trap — intercepting function calls

// Wrap any function with logging, caching, rate-limiting, etc.
function memoize(fn) {
  const cache = new Map()
  return new Proxy(fn, {
    apply(target, thisArg, args) {
      const key = JSON.stringify(args)
      if (cache.has(key)) {
        console.log('cache hit:', key)
        return cache.get(key)
      }
      const result = Reflect.apply(target, thisArg, args)
      cache.set(key, result)
      return result
    }
  })
}

function expensiveCalc(n) {
  return n * n  // imagine this takes 1 second
}

const memoized = memoize(expensiveCalc)
memoized(5)   // computes, caches
memoized(5)   // 'cache hit: [5]' — returns instantly
memoized(10)  // computes, caches

Reflect — why it exists alongside Proxy

Reflect provides a function form of every fundamental object operation. Before Reflect, some operations were only available as syntax (in, delete, new) which can't be delegated programmatically. Reflect makes them first-class functions.

// Reflect mirrors every Proxy trap exactly — one Reflect method per trap
Reflect.get(target, 'name')                  // target['name']
Reflect.set(target, 'name', 'Bob')           // target['name'] = 'Bob'
Reflect.has(target, 'name')                  // 'name' in target
Reflect.deleteProperty(target, 'name')       // delete target['name']
Reflect.apply(fn, thisArg, args)             // fn.apply(thisArg, args)
Reflect.construct(Constructor, args)         // new Constructor(...args)
Reflect.ownKeys(target)                      // all own keys including symbols

// Reflect.set returns boolean (success/failure) — Object assignment throws or fails silently
// Reflect.defineProperty returns boolean — Object.defineProperty throws on failure
// Consistent return values make error handling cleaner in traps

// The receiver parameter — critical for correct prototype behavior
const proto = {
  get value() { return this._value }
}
const child = Object.create(proto)
child._value = 42

// Without receiver — 'this' in the getter refers to proto, not child:
Reflect.get(proto, 'value')              // undefined (_value not on proto)
// With receiver — 'this' is child:
Reflect.get(proto, 'value', child)       // 42 ← correct behavior

Revocable proxies — controlled access

const { proxy, revoke } = Proxy.revocable({ secret: 'password123' }, {
  get(target, key) {
    return Reflect.get(target, key)
  }
})

proxy.secret  // 'password123'

// After access window expires:
revoke()

proxy.secret  // TypeError: Cannot perform 'get' on a proxy that has been revoked
// The object becomes inaccessible — even the reference is neutered

// Use case: grant temporary access to a resource
function grantTemporaryAccess(resource, ms) {
  const { proxy, revoke } = Proxy.revocable(resource, {})
  setTimeout(revoke, ms)
  return proxy
}

Proxy limitations

// 1. Built-in objects with internal slots need special handling
// Map, Set, Date, Promise use internal slots that Proxy can't intercept directly
const mapProxy = new Proxy(new Map(), {})
mapProxy.set('key', 'value')  // TypeError: Method Map.prototype.set called on incompatible receiver
// Fix: bind the target's methods
const mapProxy2 = new Proxy(new Map(), {
  get(target, key) {
    const value = Reflect.get(target, key)
    return typeof value === 'function' ? value.bind(target) : value
  }
})
mapProxy2.set('key', 'value')  // works

// 2. Proxies have performance overhead — every operation goes through the trap
// Don't wrap hot paths in proxies in performance-critical code

// 3. Identity — proxy !== target
const target = {}
const proxy  = new Proxy(target, {})
proxy  === target   // false — different references
proxy  instanceof Object  // true — prototype chain is proxied through