Reflect

Reflect is the object model’s service desk

JavaScript already has many ways to perform object operations: dot access, bracket access, in, delete, new, Object.defineProperty, and Function.prototype.apply. Reflect gathers the core operations behind those tools into plain functions.

That sounds abstract until you write a Proxy. A proxy trap intercepts an operation, and very often you want to log, validate, or tweak one thing, then do the normal operation. Reflect gives you the matching official forwarding function.

In this lesson you will compare Reflect with Object methods, preserve a getter’s receiver, forward proxy traps, inspect key order, and use Reflect.apply and Reflect.construct for advanced calls.

Reflect is not magic. Each method is a named function for an operation JavaScript already knows how to do. The full list is: apply, construct, defineProperty, deleteProperty, get, getOwnPropertyDescriptor, getPrototypeOf, has, isExtensible, ownKeys, preventExtensions, set, and setPrototypeOf.

The methods that change shape or write state often return a boolean: defineProperty, set, deleteProperty, preventExtensions, and setPrototypeOf. That boolean is especially useful in strict-mode code and proxy traps.

Some Object methods and operators throw or coerce in ways that are awkward when you are writing generic code. Object.defineProperty throws if it cannot define; Reflect.defineProperty returns false. Object.getPrototypeOf(1) coerces a primitive wrapper in modern JavaScript, while Reflect.getPrototypeOf(1) throws TypeError because Reflect expects an object target.

1"use strict";2const locked = Object.preventExtensions({});Run3let objectResult;4try {5  Object.defineProperty(locked, "id", { value: 1 });6} catch (error) {7  objectResult = error.name;8}9const reflectResult = Reflect.defineProperty(locked, "id", { value: 1 });10console.log(objectResult);11console.log(reflectResult);

Here is the broader quick map: Reflect.has mirrors in, Reflect.deleteProperty mirrors delete, and Reflect.ownKeys sees more keys than Object.keys.

1const box = { visible: 1 };2const sym = Symbol("tag");3Object.defineProperty(box, "hidden", { value: 2 });4box[sym] = 3;5 6console.log(Reflect.has(box, "visible"));7console.log(Reflect.deleteProperty(box, "missing"));8console.log(Reflect.ownKeys(box));9console.log(Object.keys(box));

const box = { visible: 1 };
const sym = Symbol("tag");
Object.defineProperty(box, "hidden", { value: 2 });
box[sym] = 3;

console.log(Reflect.has(box, "visible"));
console.log(Reflect.deleteProperty(box, "missing"));
console.log(Reflect.ownKeys(box));
console.log(Object.keys(box));

The receiver is the object that should become this when a getter or setter runs. With plain obj.value, the receiver is usually obj. In inheritance and proxies, the target that owns the getter and the object that asked for the value can be different.

1"use strict";2const badge = {Run3  name: "prototype badge",4  get label() {5    return this.name;6  }7};8const user = Object.create(badge);9user.name = "Ada";10const proxy = new Proxy(user, {11  get(target, key, receiver) {12    return target[key];13  }14});15console.log(proxy.label);

In a simple example both versions may print the same value. The bug appears when the getter does more work, when a setter validates using this, or when another proxy should see the nested name read. Inside a proxy get trap, prefer return Reflect.get(target, key, receiver).

A proxy handler often looks like a switchboard: log the operation, then forward it. The safest default is to accept the trap’s arguments with ...args and pass those exact arguments to the matching Reflect method.

1"use strict";2const target = { count: 0 };Run3const log = [];4const proxy = new Proxy(target, {5  get(...args) {6    log.push("get:" + String(args[1]));7    return Reflect.get(...args);8  },9  set(...args) {10    log.push("set:" + String(args[1]));11    return Reflect.set(...args);12  }13});14proxy.count = proxy.count + 1;15console.log(target.count);16console.log(log.join(", "));

Object.keys is intentionally friendly: own, enumerable, string keys only. Reflect.ownKeys is the complete own-key list: integer-like string keys in ascending order, then other string keys in insertion order, then symbols in insertion order. It includes non-enumerable keys.

1const sym = Symbol("id");2const record = { 20: "twenty", name: "Ada", 3: "three" };3Object.defineProperty(record, "hidden", { value: true });4record[sym] = "symbol value";5 6console.log(Reflect.ownKeys(record));7console.log(Object.keys(record));

That ordering is why arrays and array-like objects feel consistent, while symbols still remain separate from ordinary string names. Review the Symbols lesson if symbol keys are still new.

Reflect.apply(fn, thisArg, args) calls a function with a chosen this and an array-like list of arguments. It is the modern, symmetrical cousin of fn.apply(thisArg, args), which you met in the call, apply & bind lesson.

Reflect.construct(Target, args, NewTarget) is more unusual. It runs Target as a constructor, but the optional third argument controls new.target inside the constructor and the prototype used for the created object. That connects to the lessons on constructors and new.

1function total(prefix, ...numbers) {2  return prefix + numbers.reduce((sum, n) => sum + n, 0);3}4function Base(name) {5  this.name = name;6  this.createdBy = new.target === Special ? "Special" : "Base";7}8function Special() {}9 10console.log(Reflect.apply(total, null, ["$", 2, 3, 4]));11const item = Reflect.construct(Base, ["Ada"], Special);12console.log(item.createdBy);13console.log(Object.getPrototypeOf(item) === Special.prototype);

function total(prefix, ...numbers) {
  return prefix + numbers.reduce((sum, n) => sum + n, 0);
}
function Base(name) {
  this.name = name;
  this.createdBy = new.target === Special ? "Special" : "Base";
}
function Special() {}

console.log(Reflect.apply(total, null, ["$", 2, 3, 4]));
const item = Reflect.construct(Base, ["Ada"], Special);
console.log(item.createdBy);
console.log(Object.getPrototypeOf(item) === Special.prototype);

Where you’ll use Reflect

Reflect shows up most often in libraries: validation proxies, observable objects, RPC layers, test doubles, data mappers, and frameworks that need to forward JavaScript’s normal object behavior while adding a little work around it.

The habit is simple: if you are inside a proxy trap and want ordinary behavior, reach for the matching Reflect method first. Then add only the extra behavior you actually need.

Common misconceptions

• “Reflect never throws.” Many methods return booleans for operation failure, but Reflect methods still throw TypeError when the target must be an object and is not.
• “Reflect is only for proxies.” Proxies are the main use, but the function forms are useful in generic helpers too.
• “Reflect.ownKeys is the same as Object.keys.” It includes non-enumerable strings and symbols; Object.keys does not.
• “The receiver is always the target.” In inherited getters and proxy traps, the receiver can be the original object that asked.
• “Reflect.construct just avoids new.” Its third argument controls new.target and the new object’s prototype.
• “A set trap can forget to return.” In strict mode that becomes undefined, which means failure and throws.

Key takeaways

• Reflect exposes JavaScript’s object operations as plain functions.
• There are 13 Reflect methods, matching the 13 proxy traps.
• Several mutating Reflect methods return booleans instead of throwing for ordinary operation failure.
• Use Reflect.get and Reflect.set with the receiver when forwarding proxy traps.
• Reflect.ownKeys returns integer-like strings, other strings, then symbols, including non-enumerable keys.
• Reflect.construct can set new.target with its third argument.

Reflect is the standard function-based API for performing and forwarding JavaScript object operations.

Up next: Well-known symbols.