get and set traps

Learn to intercept property read and write with get and set traps.

The get trap

The get trap runs whenever a property is read. When you write proxy.name, the handler's get method fires and its return value is handed back to you.

const handler = {
  get(target, prop) {
    return target[prop];
  }
};

The trap signature is get(target, prop, receiver). Here target is the wrapped object, prop is the property name being read, and receiver is the Proxy itself. You can return any value, so reads can be hidden or transformed.

The set trap

The set trap runs whenever a property is assigned. When you write proxy.age = 28, the handler's set method fires.

const handler = {
  set(target, prop, value) {
    target[prop] = value;
    return true;
  }
};

The trap signature is set(target, prop, value, receiver). The value is the new value being assigned. A set trap must return true; otherwise the assignment fails in strict mode. You can validate, transform, or reject the value from here.

Exercise Write get and set traps

Define an object named user with a name property. Inside a handler, write the get and set traps: get returns target[prop], set runs target[prop] = value and returns true. Create a proxy variable with new Proxy(user, handler). Assign proxy.age = 28 and log it with console.log(proxy.age).

Show example solution

const user = { name: 'Ayşe' };
const handler = {
  get(target, prop) {
    return target[prop];
  },
  set(target, prop, value) {
    target[prop] = value;
    return true;
  }
};
const proxy = new Proxy(user, handler);
proxy.age = 28;
console.log(proxy.age);

Test yourself

Return the value inside the get trap

get(target, prop) {
  return ____;
}

Show answer

get(target, prop) {
  return target[prop];
}

How many parameters does the get trap take?
- target, prop and receiver
- only target
- only prop
- target and value
Show answer

target, prop and receiver — Correct! The get trap takes three parameters: target, prop and receiver.
Match the get and set trap concepts

get trap

intercepts read
set trap

intercepts write
target

original object
value

new value

Next lesson: has and deleteProperty traps

We Are Enhancing Your Experience

Cookie Preferences

Strictly Necessary Cookies

Analytical Cookies