JavaScript Reflect

❮ Previous Next ❯

The Reflect Object

Reflect is a object with methods for low-level operations on JavaScript objects.

With the Reflect object you can get, set, delete, and check object properties in a consistent way.

Reflect was added to JavaScript in ES6 (2015).

Yor Toolbox

Reflect is a toolbox for working with objects in a safe and consistent way.

Before Reflect

Before Reflect, object operations were scattered:

Using operators like in and delete
Using methods like Object.defineProperty
Using language mechanisms like [[Get]] and [[Set]]

After Reflect

Reflect brings all object operations into clean methods:

Reflect methods unifies object operations
Reflect methods are more predictable than operators (in/delete)
Reflect methods provides standard return values instead of errors
Reflect methods are cleaner and safer for meta-programming
Reflect methods are tailored for the Proxy object

Examples

With Reflect.has(), you get the in operator as a function.

With Reflect.delete(), you get the delete operator as a function.

Why Reflect

Reflect is safe and flexible, especially when used inside a Proxy.

Reflect.has()

The Reflect.has() method checks if an object has a specific property.

The Reflect.has() method is similar to the in operator.

Check if Property Exists

// Create an Object
const person = {name: "John", lastname: "Doe"};

let answer = Reflect.has(person, "name");

Try it Yourself »

Same as using the in operator:

let answer = "name" in person;

Try it Yourself »

Syntax
Reflect.has(obj, prop)
Properties
obj - the target object prop - the property to check
Returns
true - if true false if false
Exeptions
TypeError thrown if obj is not an object

Reflect.deleteProperty()

The Reflect.deleteProperty() method deletes a property from an object.

The Reflect.deleteProperty() method is similar to the delete operator.

Deleting a Property

// Create an Object
const person = {name: "John", lastname: "Doe"};

Reflect.deleteProperty(person, "name");

Try it Yourself »

Same as using the delete operator:

delete person.name;

Try it Yourself »

Syntax
Reflect.deleteProperty(obj, prop)
Properties
obj - the target object prop - the property to delete
Returns
true - if true false if false
Exeptions
TypeError thrown if obj is not an object

Reflect.get()

The Reflect.get() method retrieves the value of a property:

Example

// Create an Object
const user = {name: "Jan", age: 40};

let age = Reflect.get(user, "age");

Try it Yourself »

Same as:

let age = user.age;

Try it Yourself »

Syntax
Reflect.get(obj, prop [,receiver])
Properties
obj - the target object prop - the property to get receiver - the this value if it is a getter
Returns
The value of the property
Exeptions
TypeError thrown if obj is not an object

Reflect.set()

The Reflect.set() method sets the value of a property:

Example

// Create an Object
const user = {name: "Jan", age: 40};

Reflect.set(user, "age", 41);

let age = Reflect.set(user, "age");

Try it Yourself »

Same as:

user.age = 41;

Try it Yourself »

Syntax
Reflect.set(obj, prop, value [,receiver])
Properties
obj - the target object prop - the property to set value - the value to set receiver - the this value if it is a setter
Returns
true - for success false - if not
Exeptions
TypeError thrown if obj is not an object

Reflect.apply()

The Reflect.apply() method calls a function with a this value and an argument array.

Example

function greet(message) {
return message + ", " + this.name;
}

const person = {name: "Jan"};

let msg = Reflect.apply(greet, person, ["Hello"]);

Try it Yourself »

Same as using greet.apply():

let msg = greet.apply(person, ["Hello"]);

Try it Yourself »

Syntax
Reflect.apply(function, this, arguments)
Properties
function - target object (function) this - the value of this calling the target arguments - array-like object of function arguments
Returns
The return value from the function
Exeptions
TypeError thrown if function is not a function or arguments is not an object

Note

Reflect.apply() is preferred when:

You are doing meta-programming
You are inside a Proxy handler
You want consistent behaviors (no silent errors)
You want to mirror JavaScript's internal operations

Reflect.construct()

The Reflect.construct() method acts like the new operator, creating a new instance of target with the provided arguments. newTarget allows for custom new.target values for subclassing.

Example

// Create a new Array
const colors = Reflect.construct(Array, ["red", "green", "blue"]);

Try it Yourself »

Same as the new keyword:

// Create a new Array
const colors = new Array(["red", "green", "blue"]));

Try it Yourself »

Syntax
Reflect.construct(obj, args [, newTarget])
Properties
obj - the constructor object args - an array-like object of arguments to be passed newTarget - the constructor
Returns
A new object constructed from the argumets list
Exeptions
TypeError thrown if obj or newTarget is not a constructor, or if args is not an object

Reflect.defineProperty()

The Reflect.defineProperty() defines or modifies a property.

Example

// Create an Object
const user = {};

// Add a Property
Reflect.defineProperty(user, "id", {
value: 123,
writable: false
});

Try it Yourself »

Same as using Object.defineProperty():

// Add a Property
Object.defineProperty(user, "id", {
value: 123,
writable: false
});

Try it Yourself »

Syntax
Reflect.defineProperty(obj, prop, attributes)
Properties
obj - the target object prop - the property to define attributes - an array-like object of the property attributes
Returns

Exeptions
TypeError thrown if obj is not an object or attributes is not an object

Reflect.defineProperty() in Proxy

Reflect.defineProperty() must be used in Proxy

If used in a Proxy, the defineProperty trap must return true or false.

Object.defineProperty() returns the target object
Reflect.defineProperty() returns true or false

Reflect.ownKeys()

The Reflect.ownKeys(obj) method returns an array of an object's own property keys (string and Symbol based), similar to combining Object.getOwnPropertyNames() and Object.getOwnPropertySymbols().

Example

const sym = Symbol("secret");
const obj = { a: 1, [sym]: 2 };

let keys = Reflect.ownKeys(obj);

Try it Yourself »

Almost the same as using Object.keys():

let keys = Object.keys(obj);

Try it Yourself »

Syntax
Reflect.ownKeys(obj)
Properties
obj - the target object
Returns
An Array of the object's own property keys, including strings and symbols
Exeptions
TypeError thrown if obj is not an object

Why Using Reflect?

Reflect.ownKeys() also returns symbols.

Object.keys() does not.

Reflect.isExtensible()

The Reflect.isExtensible() method Checks if an object is extensible (can have properties added), similar to Object.isExtensible().

Example

let answer = Reflect.isExtensible(obj);

The same as using Object.isExtensible():

let answer = Object.isExtensible(obj);

Syntax
Reflect.isExtensible(obj)
Properties
obj - the target object
Returns
true - is extensible false - is not
Exeptions
TypeError thrown if obj is not an object

Why Using Reflect?

Object.isExtensible() is a user method - not part of the internal trap machinery.

Reflect.isExtensible() maps directly to the internal [[IsExtensible]] method.

Reflect.isExtensible() correctly handles primitive targets, which matters when proxied.

Reflect.isExtensible(1); // TypeError
Object.isExtensible(1); // false (does not throw)

When to Use Reflect?

Case	Use	Why
Getting / setting values	Yes	If you need consistent return values
Creating new objects	Yes	Reflect.construct() works with Proxy
Calling a function with context	Yes	Reflect.apply() is cleaner than func.apply()
Meta programming	Yes	Designed for low-level tasks
Simple object work	No	Use normal JS syntax

Reflect with Proxy (Very Common)

Proxy lets you intercept operations on objects:

Example

// Create an Object
const user = { name: "Jan", age: 40 };

// Create a Proxy
const proxy = new Proxy(user, {
  set(target, property, value) {
    log(property + ": " + value);
    // safe forwarding
    return Reflect.set(target, property, value);
  }
});

Try it Yourself »

Note

Reflect can provide safe and unified forwarding calls.

Reflect ensures that a Proxy behaves like a normal object.

Proxy and Reflect

Proxy was designed first. Reflect was designed second.

Proxy was designed to allow JavaScript developers to:

Intercept property access
Override default property behaviors
Validate data
Wrap functions
Virtualize objects
Create reactive objects

The idea of Proxy was developed during the ES6 (2015) design phase before Reflect existed.

However, Proxy had a big issue:

"How to forward an intercepted operations safely?"

JavaScript had no functional equivalents of many operations.

Because of this limitation, Reflect was invented.