DEV Community

loading...
Cover image for ES6 Reflections

ES6 Reflections

pld208 profile image Patrice Williams ・3 min read

Introduction

JavaScript added some great new features in 2015 (ECMAScript 2015- ES6), one of those being a global method called reflect. Reflect is a built-in object that provides unchanging properties and methods, which have the same names as “the proxy handler methods” (MDN, 2020). Before ES6 was introduced, JavaScript did contain features that were similar to reflections. These features were not called reflections, but had similar usage, like Object.keys(), Object.getOwnPropertyDescriptor(), and Array.isArray(). The Reflect API allows you to "call methods, construct objects, get and set properties, manipulate and extend properties" (Javascript tutorial).

The Reflect API is a global object, but it is slightly different than other global objects. Reflect is not a function object, so you are unable to construct it. This means you cannot use the new operator or call Reflect as a function. This is similar to the Math and JSON objects. Methods on the Reflect object are static. The Reflect object contains the same methods as the prototypical methods on Object, but there are slight differences. Let’s explore some reflect methods.

Reflect Methods

Reflect.apply(target, thisArgument, argumentsList) – used to call a target function with arguments specified by the argumentsList parameter. It is similar to Function.prototype.apply().

Reflect.construct(target, argumentsList[, newTarget] – acts like the new operator, but as a function. It is the same as calling new target(…arguments). You can also specify a different prototype if needed.

Reflect.defineProperty(target, propertyKey, attributes) – returns a Boolean that is true if the property was defined successfully. It is similar to Object.defineProperty().

Reflect.deleteProperty(target, propertyKey) – this is the delete operator as a function. It is the same as calling delete target[propertyKey].

Reflect.get)target, propertyKey[, receiver]) – returns the value of the property. It is the same as getting a property from an object target[propertyKey] as a function.

Reflect.getOwnPropertyDescriptor(target, propertyKey) – returns a property descriptor of the given property if it exists on the object and returns undefined otherwise. It is similar to Object.getOwnPropertyDescriptor().

Reflect.getPropertyOf(target) – same as Object.getPrototypeOf().

Reflect.has(target, propertyKey) – returns a Boolean depending on whether the target has the property or not. The target can have the property as its own or inherited. This method works like the ‘in operator’ as a function.

Reflect.isExtensible(target) – returns a Boolean that is true if the target is extensible. This works the same as Object.isExtensible().

Reflect.ownKeys(target) – returns an array of the target object’s own property keys. The property keys cannot be inherited.

Reflect.preventExtensions(target) – returns a Boolean that is true if the update was successful.

Reflect.set(target, propertyKey, value[, receiver] – a function that assigns values to properties and returns a Boolean that is true if the update was successful.

Reflect.setPrototypeOf(target, prototype) – a function that sets the prototype of an object and returns a Boolean that is true if the update was successful.
(MDN Reflect, 2020)

Examples

Let’s look at some examples to show all of the many features of the Reflect API. Below, we have a dog object. Lets check to see if we have a specific key.

Alt Text

Using the same object, we will also return the object's own keys and add a new property.

Alt Text

Lastly, we will construct an object using Reflect.

Alt Text

As stated above, the Reflect.construct() returns the new instance of the target or newTarget (whichever one is specified), “initialized by the target as a constructor with the given array-like object args” (JavaScript 2020). In this example, we created a new instance of the Highschool class using the Reflect.construct() method. The bestSchool object is an instance of the HighSchool class so it has the nameLocation property.

Conclusion

The Reflect API is a valuable addition to JavaScript. Reflect allows you to create programs and frameworks that can handle dynamic code. After reading my brief introduction to Reflect, I hope that you will utilize its features.

Sources

MDN. Reflect. Retrieved December 20, 2020, from https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect
JavaScript Reflection and Reflect API in ES6 By Practical Examples. (2020, January 30). Retrieved December 20, 2020, from https://www.javascripttutorial.net/es6/javascript-reflection/

Discussion (0)

pic
Editor guide