JavaScript regex properties help to return the function and its prototype using regex fields and values. It is used to create the function of the object's prototype. The constructor properties return the various references for JavaScript types:
- Regular Expression: The constructor property gets the output " function RegExp { [native code] } " for regex.
- Numbers: The constructor property gets the output "function Number { [native code] }" for input numbers.
- Strings: The constructor property gets the output "function String { [native code] }" for input strings.
- Array: The constructor property gets the output "function Array { [native code] }" for input strings.
- Boolean: The constructor property gets the output "function Boolean { [native code] }" for input strings.
Syntax
To retrieve the prototype of an object, the syntax below is employed.
regexObject.constructor;
Explanation:
- The keyword "constructor" specifies the type of output, which can be Number, String, or Array.
- The output is displayed in the format "function output_type {[native code]}".
Supported Browsers
The browsers supported by the RegExp constructor are listed below:
- Google Chrome version 1 and later
- Edge version 12 and later
- Firefox version 1 and later
- Internet Explorer 4 and later
- Opera 5 and later
- Safari 1 and later
The provided instances demonstrate the compatibility between various types of regular expressions and their corresponding values.
Example 1:
The illustration demonstrates the regular expression native code pertaining to the constructor attribute. In this case, the constructor keyword is employed directly with the regular expression.
<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp constructor properties
</title>
<style>
#demo1{
background-color: orange;
border: 1px solid black;
width: 350px;
}
</style>
</head>
<body>
<div id = "demo1">
<h3>
JavaScript RegExp constructor properties
</h3>
<h4> The constructor property gets the RegExp prototype of the regex function
</h4>
<!--click the button to get the constructor properties output -->
<button onclick = "display_value();"> Click Here! </button>
<div id = "regex_constructor"> </div>
</div>
<script>
function display_value() {
//use regex value
let constructor_pattern = /javascript/;
//regex pattern with constructor keyword
var final_result = constructor_pattern.constructor;
// output shows RegExp() {[native code]}
var ele_demo = document.getElementById("regex_constructor");
ele_demo.innerHTML = "Available constructor: "+ final_result;
}
</script>
</body>
</html>
Output:
The output displays the native code for the object function.
Example 2:
The provided example demonstrates the implementation of the array function's native code related to the constructor property. In this instance, a regular expression value is employed in conjunction with the match method utilizing the constructor keyword.
<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp constructor properties
</title>
<style>
#demo1{
background-color: orange;
border: 1px solid black;
width: 370px;
}
</style>
</head>
<body>
<div id = "demo1">
<h3>
JavaScript RegExp constructor properties
</h3>
<h4> The constructor property gets the RegExp Array prototype
</h4>
<!--click the button to get the constructor properties output -->
<button onclick = "display_value();"> Click Here! </button>
<div id = "regex_constructor"> </div>
</div>
<script>
function display_value() {
let constructor_pattern = /^22/;
let input = "220 132 22";
//use the match method to get the array format value
var quant_result = input.match(constructor_pattern);
//result of the regex with a method for constructor property
var final_result = quant_result.constructor;
// output shows Array() {[native code]}
var ele_demo = document.getElementById("regex_constructor");
ele_demo.innerHTML = "Available constructor: "+ final_result;
}
</script>
</body>
</html>
Output:
The output displays the native code for the object function.
Example 3:
The illustration demonstrates the string representation of the constructor property. In this case, we employ the regex replace method in conjunction with the constructor keyword.
<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp constructor properties
</title>
<style>
#demo1{
background-color: orange;
border: 1px solid black;
width: 370px;
}
</style>
</head>
<body>
<div id = "demo1">
<h3>
JavaScript RegExp constructor properties
</h3>
<h4> The constructor property gets the RegExp String prototype
</h4>
<!--click the button to get the constructor properties output -->
<button onclick = "display_value();"> Click Here! </button>
<div id = "regex_constructor"> </div>
</div>
<script>
function display_value() {
const input_str = "javaaC# Tutorial";
let constructor_pattern = new RegExp("a{2, }", "g");
let replace_val = "@";
//use replace method to get the String format value
let quant_result = input_str.replace(constructor_pattern, replace_val);
var final_result = quant_result.constructor;
// output shows String() {[native code]}
var ele_demo = document.getElementById("regex_constructor");
ele_demo.innerHTML = "Available constructor: "+ final_result;
}
</script>
</body>
</html>
Output:
The output displays the machine code for the object function.
Example 4:
The provided example illustrates the native code for the constructor property within the number function. In this scenario, the regex value is utilized to search for the constructor keyword.
<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp constructor properties
</title>
<style>
#demo1{
background-color: orange;
border: 1px solid black;
width: 350px;
}
</style>
</head>
<body>
<div id = "demo1">
<h3>
JavaScript RegExp constructor properties
</h3>
<h4> The constructor property gets the RegExp number prototype
</h4>
<!--click the button to get the constructor properties output -->
<button onclick = "display_value();"> Click Here! </button>
<div id = "regex_constructor"> </div>
</div>
<script>
function display_value() {
let constructor_pattern = /22/gi;
let input = "220 132 22";
//use the search method to get the String format value
var quant_result = input.search(constructor_pattern);
//use output of regex method with the constructor keyword
var final_result = quant_result.constructor;
// output shows Number() {[native code]}
var ele_demo = document.getElementById("regex_constructor");
ele_demo.innerHTML = "Available constructor: "+ final_result;
}
</script>
</body>
</html>
Output:
The output displays the object function's native code.
Example 5:
In this instance, the code snippet demonstrates the native Boolean code for the constructor attribute. It showcases the application of the constructor keyword alongside the regex test method.
<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp constructor properties
</title>
<style>
#demo1{
background-color: orange;
border: 1px solid black;
width: 350px;
}
</style>
</head>
<body>
<div id = "demo1">
<h3>
JavaScript RegExp constructor properties
</h3>
<h4> The constructor property gets the RegExp boolean prototype
</h4>
<!--click the button to get the constructor properties output -->
<button onclick = "display_value();"> Click Here! </button>
<div id = "regex_constructor"> </div>
</div>
<script>
function display_value() {
let constructor_pattern = /22/gi;
let input = "220 132 22";
//use the match method to get the test format value
var quant_result = constructor_pattern.test(input);
var final_result = quant_result.constructor;
// output shows Boolean() {[native code]}
var ele_demo = document.getElementById("regex_constructor");
ele_demo.innerHTML = "Available constructor: "+ final_result;
}
</script>
</body>
</html>
Output:
The result displays the native code for the object function.
Conclusion
The constructor property displays the built-in code for the various kinds of output. There are several techniques and modifiers available to manipulate and determine the output format of the code.