JavaScript Reflect
The Reflect Object
The Reflect object provides methods for working with JavaScript objects at a low level.
You can use Reflect to get, set, delete, and check properties in a consistent way.
| Method | Description |
|---|---|
| Reflect.get() | Get a property value |
| Reflect.set() | Set a property value |
| Reflect.has() | Check if a property exists |
| Reflect.deleteProperty() | Delete a property |
| Reflect.defineProperty() | Define a new property |
| Reflect.getOwnPropertyDescriptor() | Get property descriptor |
| Reflect.apply() | Call a function |
| Reflect.construct() | Create an object (like new) |
| Reflect.ownKeys() | Get all keys (including symbols) |
| Reflect.isExtensibles() | Check if object can grow |
| Reflect.preventExtensions() | Stop object from growing |
Why JavaScript Reflect?
Before Reflect, some operations were done using operators like in and delete, some operations were done using methods like Object.defineProperty, and some operations were used using language mechanisms like [[Get]] and [[Set]]).
Reflect brings all these into one clean API.
Before Reflect:
- operations were scattered (in, delete, Object.*)
- some returned errors, some returned booleans
- some operators were "magic" and hard to intercept
With Reflect:
- unifies everything
- has predictable behavior
- works perfectly with Proxy
Reflect was added to JavaScript ES6.
Reflect.has()
Example
// 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 »
Reflect.deleteProperty()
Example
// 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 »
When to Use Reflect?
| Case | Use | Why |
|---|---|---|
| Getting / setting values | Yes | Consistent return values |
| Creating objects like new | 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.get()
You can use Reflect.get() to read Object properties:
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 »
Reflect.set()
You can use Reflect.set() to write Object properties:
Example
// Create an Object
const user = {name: "Jan", age: 40};
Reflect.set(user, "age", 41);
let age = Reflect.get(user, "age");
Try it Yourself »
Same as:
user.age = 41;
Try it Yourself »
Reflect.apply()
Example
function greet(message) {
return message + ", " + this.name;
}
const person = {name: "Jan"};
let msg = Reflect.apply(greet, person, ["Hello"]);
Try it Yourself »
Same as:
let msg = greet.apply(person, ["Hello"]);
Try it Yourself »
Reflect.construct()
Example
// Create a new Array
const colors = Reflect.construct(Array, ["red", "green", "blue"]);
Try it Yourself »
Same as the new keyword:
const colors = new Array(["red", "green", "blue"]));
Try it Yourself »
Reflect.defineProperty()
Example
// Create an Object
const user = {};
// Add a Property
Reflect.defineProperty(user, "id", {
value: 123,
writable: false
});
Try it Yourself »
Same as the Object.defineProperty:
// Add a Property
Object.defineProperty(user, "id", {
value: 123,
writable: false
});
Try it Yourself »
Reflect.ownKeys()
Gets all keys.
Example
const sym = Symbol("secret");
const obj = { a: 1, [sym]: 2 };
let keys = Reflect.ownKeys(obj);
Try it Yourself »
Almost the same as:
let keys = Object.keys(obj);
Try it Yourself »Note
Reflect.ownKeys() also returns symbols.
Reflect with Proxy (Very Common)
Proxy lets you intercept operations on objects:
- Read a property
- Write a property
- Delete a property
- Check property existence
Example
// Create an Object
const user = { name: "Jan", age: 40 };
// Create a Proxy
const proxy = new Proxy(user, {
get(target, prop) {
// safe forwarding
return Reflect.get(target, prop);
},
set(target, prop, value) {
// safe forwarding
return Reflect.set(target, prop, value);
}
});
Try it Yourself »