Reflection is the ability of a code to inspect and manipulate variables, properties, and methods of objects at runtime. JavaScript already provides Object.keys(), Object.getOwnPropertyDescriptor(), and Array.isArray() methods as classic refection features. In ES6, it has been officially provided through Reflect object. Reflect is a new global object which is used to call methods, construct objects, get and set properties, manipulate and extend properties.
Unlike most global objects, Reflect is not a constructor. i.e, You cannot use Reflect with the new operator or invoke the Reflect as a function. It is similar to Math and JSON objects in which all the methods of this object are static.
Let's see the usage of Reflect API with below examples,
- Creating objects using Reflect.construct();
The construct() method behaves like the regular new operator, but as a function. It is equivalent to calling new target(...args) with an option to specify a different prototype. The syntax looks like as below,
Reflect.construct(target, args [, newTarget]);
The method has below parameters,
- target: The target function to call.
- argumentsList: An array-like object specifying the arguments with which target should be called.
- newTarget: The constructor whose prototype should be used. This is an optional parameter. i.e, If newTarget is not present, its value defaults to target.
Example:
class User {
constructor(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
}
get fullName() {
return `${this.firstName} ${this.lastName}`;
}
};
let args = ['John', 'Emma'];
let john = Reflect.construct(
User,
args
);
console.log(john instanceof User);
console.log(john.fullName);
- Calling a function using Reflect.apply():
Prior to ES6, you can invoke a function with a specified
this value and arguments by using the Function.prototype.apply() method.
For example, you can call max() static method of Math object,
const max = Function.prototype.apply.call(Math.max, Math, [100, 200, 300]);
console.log(max);
In ES6, Reflect.apply() provides the same features as Function.prototype.apply() but in a less verbose syntax.
const max = Reflect.apply(Math.max, Math, [100, 200, 300]);
console.log(max);
- Defining a property using Reflect.defineProperty():
The
Reflect.defineProperty() method is similar to Object.defineProperty() but it returns a Boolean value indicating whether or not the property was defined successfully instead of throwing an exception.
The syntax of this method looks like below,
Reflect.defineProperty(target, propertyName, propertyDescriptor)
Let's define the age property on user object,
class User {
constructor(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
}
get fullName() {
return `${this.firstName} ${this.lastName}`;
}
};
let john = new User('John', 'Resig');
if (Reflect.defineProperty(john, 'age', {
writable: true,
configurable: true,
enumerable: false,
value: 33,
})) {
console.log(john.age);
} else {
console.log('Cannot define the age property on the user object.');
}
- Delete property using Reflect.deleteProperty():
The Reflect.deleteProperty() method is used to delete properties like the delete operator but as a function. It returns Boolean value indicating whether or not the property was successfully deleted.
const user = {
name: 'John',
age: 33
};
console.log(Reflect.deleteProperty(user, 'age'));
console.log(user.age);
- Get property of an object using Reflect.get():
The
Reflect.get method is used to get a property on an object like the property accessor syntax but as a function.
const user = {
name: 'John',
age: 33
};
console.log(Reflect.get(user, 'age'));
- :
