JavaScript Reflect Methods

Last Updated : 08 Mar, 2021

Reflect is a built-in JavaScript object which gives access to other methods for interceptable operations. JavaScript Reflect methods are the same as those of proxy handlers and are static just like the Math object. As it is not a JavaScript function object, so it’s not constructible. It cannot be used with the JavaScript new operator and cannot be invoked as a function.

Static methods: JavaScript Reflect object provides the following static methods.

Below are examples of the JavaScript Reflect object methods.

Example 1: The following example demonstrates Reflect.has(target, propertyKey) method which returns a Boolean if the target parameter has the property.

HTML

<!DOCTYPE html> 
<html lang="en"> 
<head> 
  <meta charset="UTF-8" /> 
  <meta name="viewport" 
        content="width=device-width, initial-scale=1.0" />  
</head> 
<body> 
    
  <script type='text/javascript'> 
  
    const car = { 
      name: 'Maruti', 
      color: 'white', 
      model: '2019' 
    } 
  
    // If the target has the property, it returns a Boolean.     
    // It acts like the in operator in a function. 
    console.log("car object has 'color' property :",  
                             Reflect.has(car, 'color')); 
    console.log("car object has 'haircut' property :", 
                             Reflect.has(car, 'haircut')); 
  
  </script> 
</body> 
</html>

Output :

car object has 'color' property : true
car object has 'haircut' property : false

Example 2: The following example demonstrates Reflect.ownKeys(target) method which returns an array of the target parameter’s own property keys.

HTML

<!DOCTYPE html> 
<html lang="en"> 
  
<head> 
  
  <meta charset="UTF-8" /> 
  <meta name="viewport" 
   content="width=device-width, initial-scale=1.0" />  
</head> 
<body> 
   <script type='text/javascript'> 
  
    const car = { 
      name: 'Maruti', 
      color: 'white', 
      model: '2019' 
    } 
  
    // It returns an array of the target's 
    // own property keys. 
    console.log("All the keys of the object 'car':",  
                                   Reflect.ownKeys(car)); 
  </script> 
</body> 
</html>

Output :

All the keys of the object 'car': (3)
["name", "color", "model"]

Example 3 : The following example demonstrates the Reflect.set(target, propertyKey, value[, receiver]) method that assigns values to properties returning a true Boolean value. If Reflect.set is successful, it returns true else it returns false.

HTML

<!DOCTYPE html> 
<html lang="en"> 
  
<head> 
  <meta charset="UTF-8" /> 
  <meta name="viewport" 
      content="width=device-width, initial-scale=1.0" />  
</head> 
<body> 
    
  <script type='text/javascript'> 
  
    const car = { 
      name: 'Maruti', 
      color: 'white', 
      model: '2019' 
    } 
  
    // It assigns values to properties.  
    // It returns true if the set or update is successful. 
    console.log("Insert key : 'airbags' to the object 'car':",  
                             Reflect.ownKeys(car, 'airbags', 3)); 
    console.log(car); 
  </script> 
</body> 
  
</html>

Output :

Insert key : 'airbags' to the object 'car': (3)
["name", "color", "model"]
{name: "Maruti", color: "white", model: "2019"}

Example 4: The following example demonstrates the Reflect.apply(target, thisArgument, argumentsList) which calls a target function with parameters in the argumentsList.

HTML

<!DOCTYPE html> 
<html lang="en"> 
  
<head> 
  
  <meta charset="UTF-8" /> 
  <meta name="viewport" 
      content="width=device-width, initial-scale=1.0" />  
   
</head> 
  
<body> 
   <script type='text/javascript'> 
      
    // It calls a target function with the  
    // argumentsList as parameter. 
    console.log(Reflect.apply(String.fromCharCode,  
                   undefined, [103, 101, 101, 107, 115])); 
     
    console.log(Reflect.apply(Math.floor, undefined, [3.14])); 
     
    console.log(Reflect.apply(RegExp.prototype.exec, /ab/,  
                                    ['confabulation']).index); 
    
    console.log(Reflect.apply(''.charAt, 'geeksforgeeks', [6])); 
     
  </script> 
</body> 
  
</html>