JavaScript Regex ^ Quantifier

JavaScript regular expression uses the "^" quantifier to contain input characters at the start of the string. The ^ quantifier filters the value at the beginning of input information using methods. The modifier operates with the regexp method and quantifier to operate, replace, search, and match data.

Syntax

The following syntax uses the regex "^" quantifier to get unavailable characters.

Description

The global, multiline, and case-insensitive modifiers work with the starting character quantifier.
The "value" represents the input character at the string's start.

Supported browsers

The given browsers operate for the javascript regular expression's "^" quantifier.

Edge
Firefox
Google Chrome
Internet Explorer
Opera
Safari

Examples

The examples work with different methods, values, and modifiers using the regular expression of the "^" quantifier in JavaScript.

Example1

The example uses the match() method with the different values for the regex quantifier. The first value shows null output, and the second value shows the available value at the start of the string.

<!DOCTYPE html>
<html>
<head>
    <title>
        JavaScript RegExp quantifier
    </title>
    <style>
        #demo1 {
            background-color: orange;
            border: 1px solid black;
            width: 370px;
        }
    </style>
</head>
<body>
    <div id="demo1">
        <h3>
            JavaScript RegExp ^ quantifier
        </h3>
        <h4> The regex ^ quantifier operates with the match method
        </h4>
        <div id="regex_quantifier">
        </div>
        <div id="regex_quantifier2">
        </div>
        <!-- Click the button to get the quantifier output -->
        <button onclick="quant_click();"> Click Here!</button>
    </div>
    <script>
        function quant_click() {
            //not available character at the start of the string
            var quant_q1 = "is java and javascript language learn from Javatpoint website";
            let quantifier_pattern = /^java/g;
            var quant_alter1 = quant_q1.match(quantifier_pattern);
            var quant_ele = document.getElementById("regex_quantifier");
            quant_ele.innerHTML = "Available java character: " + quant_alter1;
            //available character at the start of the string
            let quantifier_pattern2 = /^is/g;
            var quant_alter2 = quant_q1.match(quantifier_pattern2);
            var quant_ele2 = document.getElementById("regex_quantifier2");
            quant_ele2.innerHTML = "Available website character: " + quant_alter2;
        }
    </script>
</body>
</html>

Output

The output shows the available characters at the start of the string.

Example 2

The example uses the match() method with the global and case-insensitive modifier for the regex quantifier. We can see the difference between the two modifiers with the string.

<!DOCTYPE html>
<html>
<head>
    <title>
        JavaScript RegExp quantifier
    </title>
    <style>
        #demo1 {
            background-color: orange;
            border: 1px solid black;
            width: 370px;
        }
    </style>
</head>
<body>
    <div id="demo1">
        <h3>
            JavaScript RegExp ^ quantifier
        </h3>
        <h4>
            The regex ^ quantifier operates with the match method using the global and case-insensitive modifier.
        </h4>
        <div id="regex_quantifier">
        </div>
        <div id="regex_quantifier2">
        </div>
        <!-- Click the button to get the quantifier output -->
        <button onclick="quant_click();"> Click Here! </button>
    </div>
    <script>
        function quant_click() {
            var quant_q1 = "IS java and javascript language learn from Javatpoint                  		WEBSITE";
            // use regex available at the start position 
            let quantifier_pattern = /^is/g;
            var quant_alter1 = quant_q1.match(quantifier_pattern);
            var quant_ele = document.getElementById("regex_quantifier");
            quant_ele.innerHTML = "Available java character: " + quant_alter1;
            // use regex with global and case-insensitive modifier
            let quantifier_pattern2 = /^is/gi;
            var quant_alter2 = quant_q1.match(quantifier_pattern2);
            var quant_ele2 = document.getElementById("regex_quantifier2");
            quant_ele2.innerHTML = "Available website character: " + quant_alter2;
        }
    </script>
</body>
</html>

Output

The output shows the available characters at the start of the string.

Example 3

The example uses the quantifier and search() method with the various values for the regex quantifier. The first value shows "-1" output, and the second value shows the position of the characters.

<!DOCTYPE html>
<html>
<head>
    <title>
        JavaScript RegExp quantifier
    </title>
    <style>
        #demo1 {
            background-color: orange;
            border: 1px solid black;
            width: 370px;
        }
    </style>
</head>
<body>
    <div id="demo1">
        <h3>
            JavaScript RegExp ^ quantifier
        </h3>
        <h4> The regex ^ quantifier operates with the search method
        </h4>
        <div id="regex_quantifier"> </div>
        <div id="regex_quantifier2"> </div>
        <!-- Click the button to get the quantifier output -->
        <button onclick="quant_click();"> Click Here! </button>
    </div>
    <script>
        function quant_click() {
            //not available character at the start character of the string
            var quant_q1 = "is java and javascript language learn from Javatpoint website";
            let quantifier_pattern = /^java/g;
            var quant_alter1 = quant_q1.search(quantifier_pattern);
            var quant_ele = document.getElementById("regex_quantifier");
            quant_ele.innerHTML = "Available java character: " + quant_alter1;
            //available character at the start of the string
            let quantifier_pattern2 = /^is/g;
            var quant_alter2 = quant_q1.search(quantifier_pattern2);
            var quant_ele2 = document.getElementById("regex_quantifier2");
            quant_ele2.innerHTML = "Available website character: " + quant_alter2;
        }
    </script>
</body>
</html>

Output

The output shows the available position start of the input string.

Example 4

The example uses the quantifier and test() method with the various values for the regex quantifier. The first value shows "false" output, and the second regular expression shows "true" output.

<!DOCTYPE html>
<html>

<head>
    <title>
        JavaScript RegExp quantifier
    </title>
    <style>
        #demo1 {
            background-color: orange;
            border: 1px solid black;
            width: 370px;
        }
    </style>
</head>
<body>
    <div id="demo1">
        <h3>
            JavaScript RegExp "^" quantifier
        </h3>
        <h4> the javascript regex "^" quantifier operates with the test method
        </h4>
        <div id="regex_quantifier"> </div>
        <div id="regex_quantifier2"> </div>
        <!-- Click the button to get the quantifier output -->
        <button onclick="quant_click();"> Click Here! </button>
    </div>
    <script>
        function quant_click() {
            //not available character at the start string
            var quant_q1 = "java and javascript language learn from Javatpoint website";
            let quantifier_pattern = /^java/g;
            var quant_alter1 = quantifier_pattern.test(quant_q1);
            var quant_ele = document.getElementById("regex_quantifier");
            quant_ele.innerHTML = "Available java character: " + quant_alter1;
            //available character at the start string
            let quantifier_pattern2 = /^java/g;
            var quant_alter2 = quantifier_pattern2.test(quant_q1);
            var quant_ele2 = document.getElementById("regex_quantifier2");
            quant_ele2.innerHTML = "Available website character: " + quant_alter2;
        }
    </script>
</body>
</html>

Output

The output shows the Boolean value of the beginning input string.

Example 5

The example uses the quantifier and replace() method with the replaced value for the regex quantifier. We can replace or remove values with a given pattern and new keyword for regular expression.

<!DOCTYPE html>
<html>
<head>
    <title>
        JavaScript RegExp quantifier
    </title>
    <style>
        #demo1 {
            background-color: orange;
            border: 1px solid black;
            width: 370px;
        }
    </style>
</head>
<body>
    <div id="demo1">
        <h3>
            JavaScript RegExp ^ quantifier
        </h3>
        <h4> The regex ^ quantifier operates with the replace method
        </h4>
        <p> input: is java and javascript language learn from Javatpoint website </p>
        <div id="regex_quantifier"> </div>
        <div id="regex_quantifier2"> </div>
        <!-- Click the button to get the quantifier output -->
        <button onclick="quant_click();"> Click Here! </button>
    </div>
    <script>
        function quant_click() {
            //available character at the end string with regex pattern
            var quant_q1 = "is java and javascript language learn from Javatpoint website";
            let quantifier_pattern = /^is/g;
            let replace_val = "online tutorial"
            var quant_alter1 = quant_q1.replace(quantifier_pattern, replace_val);
            var quant_ele = document.getElementById("regex_quantifier");
            quant_ele.innerHTML = "replace: <b>" + quant_alter1 + "</b>";
            //Remove end string with new regexp syntax
            let quantifier_pattern2 = new RegExp("^is", "g");
            let replace_val1 = "";
            var quant_alter2 = quant_q1.replace(quantifier_pattern2, replace_val1);
            var quant_ele2 = document.getElementById("regex_quantifier2");
            quant_ele2.innerHTML = "remove: <b>" + quant_alter2 + "</b>";
        }
    </script>
</body>
</html>

Output

The output shows the replaced value of the start characters.