- JavaScript Basics
- JS Home
- JS Syntax
- JS Placements
- JS Output
- JS Statements
- JS Keywords
- JS Comments
- JS Variables
- JS var
- JS let
- JS const
- JS var Vs let Vs const
- JS Operators
- JS Arithmetic Operators
- JS Assignment Operators
- JS Comparison Operators
- JS Logical Operators
- JS Bitwise Operators
- JS Ternary Operator
- JS Operator Precedence
- JS Data Types
- JS typeof
- JS Conditional Statements
- JS Conditional Statement
- JS if Statement
- JS if...else Statement
- JS switch Statement
- JS Loops
- JS for Loop
- JS while Loop
- JS do...while Loop
- JS break Statement
- JS continue Statement
- JS break Vs. continue
- JavaScript Popup Boxes
- JS Dialog Box
- JS alert Box
- JS confirm Box
- JS prompt Box
- JavaScript Functions
- JS Functions
- JS setTimeout() Method
- JS setInterval() Method
- JavaScript Events
- JS Events
- JS onclick Event
- JS onload Event
- JS Mouse Events
- JS onreset Event
- JS onsubmit Event
- JavaScript Arrays
- JS Array
- JS Find Length of Array
- JS Add Elements at Beginning
- JS Add Element at End
- JS Remove First Element
- JS Remove Last Element
- JS Get First Index
- JS Get Last Index
- JS Reverse an Array
- JS Sort an Array
- JS Concatenate Arrays
- JS join()
- JS toString()
- JS from()
- JS Check if Value Exists
- JS Check if Array
- JS Slice an Array
- JS splice()
- JS find()
- JS findIndex()
- JS entries()
- JS every()
- JS fill()
- JS filter()
- JS forEach()
- JS map()
- JavaScript Strings
- JS String
- JS Length of String
- JS Convert to Lowercase
- JS Convert to Uppercase
- JS String Concatenation
- JS search()
- JS indexOf()
- JS search() Vs. indexOf()
- JS match()
- JS match() Vs. search()
- JS replace()
- JS toString()
- JS String()
- JS includes()
- JS substr()
- JS Slice String
- JS charAt()
- JS repeat()
- JS split()
- JS charCodeAt()
- JS fromCharCode()
- JS startsWith()
- JS endsWith()
- JS trim()
- JS lastIndexOf()
- JavaScript Objects
- JS Objects
- JS Boolean Object
- JavaScript Math/Number
- JS Math Object
- JS Math.abs()
- JS Math.max()
- JS Math.min()
- JS Math.pow()
- JS Math.sqrt()
- JS Math.cbrt()
- JS Math.round()
- JS Math.ceil()
- JS Math.floor()
- JS Math.trunc
- JS toFixed()
- JS toPrecision()
- JS Math.random()
- JS Math.sign()
- JS Number.isInteger()
- JS NaN
- JS Number()
- JS parseInt()
- JS parseFloat()
- JavaScript Date and Time
- JS Date and Time
- JS Date()
- JS getFullYear()
- JS getMonth()
- JS getDate()
- JS getDay()
- JS getHours()
- JS getMinutes()
- JS getSeconds()
- JS getMilliseconds()
- JS getTime()
- JS getUTCFullYear()
- JS getUTCMonth()
- JS getUTCDate()
- JS getUTCDay()
- JS getUTCHours()
- JS getUTCMinutes()
- JS getUTCSeconds()
- JS getUTCMilliseconds()
- JS toDateString()
- JS toLocaleDateString()
- JS toLocaleTimeString()
- JS toLocaleString()
- JS toUTCString()
- JS getTimezoneOffset()
- JS toISOString()
- JavaScript Browser Objects
- JS Browser Objects
- JS Window Object
- JS Navigator Object
- JS History Object
- JS Screen Object
- JS Location Object
- JavaScript Document Object
- JS Document Object Collection
- JS Document Object Properties
- JS Document Object Methods
- JS Document Object with Forms
- JavaScript DOM
- JS DOM
- JS DOM Nodes
- JS DOM Levels
- JS DOM Interfaces
- JavaScript Cookies
- JS Cookies
- JS Create/Delete Cookies
- JavaScript Regular Expression
- JS Regular Expression
- JS RegEx .
- JS RegEx \w and \W
- JS RegEx \d and \D
- JS RegEx \s and \S
- JS RegEx \b and \B
- JS RegEx \0
- JS RegEx \n
- JS RegEx \xxx
- JS RegEx \xdd
- JS RegEx Quantifiers
- JS RegEx test()
- JS RegEx lastIndex
- JS RegEx source
- JavaScript Advance
- JS Page Redirection
- JS Form Validation
- JS Validations
- JS Error Handling
- JS Exception Handling
- JS try-catch throw finally
- JS onerror Event
- JS Multimedia
- JS Animation
- JS Image Map
- JS Debugging
- JS Browser Detection
- JS Security
- JavaScript Misc
- JS innerHTML
- JS getElementById()
- JS getElementsByClassName()
- JS getElementsByName()
- JS getElementsByTagName()
- JS querySelector()
- JS querySelectorAll()
- JS document.write()
- JS console.log()
- JS instanceof
- JavaScript Programs
- JavaScript Programs
Quantifiers in Regular Expression JavaScript
This post is published to provide information about quantifiers used in JavaScript regular expression.
The word quantifiers in JavaScript regular expression refers to the number of characters or expressions to match.
List of Quantifiers in JavaScript Regular Expression
Quantifiers that can be used while working with regular expression are:
- n+ - used to match a string that contains one or more n
- n* - used to match a string that contains zero, one, or more occurrences of n
- n? - used to match a string containing zero or one occurrence of n
- n{X} - used to match a string that contains X sequence of n
- n{X,Y} - used to match a sequence having atleast X and Y number of digits
- n{X,} - similar to n{X}, except it matches the complete number containing at least X number of digits
- n$ - used to match whether specified string ends with n or not
- ^n - used to match if a specified string begins with n
- ?=n - used to match a string with the pattern: a specified string followed by n
- ?!n - used to check if a specified string is not followed by n
The n+ Quantifier
The n+ quantifier is used when we need to match a string that contains one or more n, where n refers to any character. For example:
<!DOCTYPE html> <html> <body> <p id="xyz"></p> <script> let myString = "JavaScript is Fun. Is not it?"; let pattern = /s+/gi; document.getElementById("xyz").innerHTML = myString.match(pattern); </script> </body> </html>
Note: The match() method is used to match a string with/using a regular expression.
In above example, from the following code snippet:
/s+/gi
The g (stands for global) and i (stands for case-insensitive) are two modifiers or flags. The g is used to find all matches (all 's') in the string, whereas i is used to find matches without caring on the case (upper and lowercase) of the character.
Since there are three words which are JavaScript, is, and Is that contains s, therefore the character s printed on the output for three times.
If we replace the following statement from above example:
with the statement given below:
let pattern = /s+/;
Then the output should be:
And with following statement:
let pattern = /s+/g;
The output should be:
The n* Quantifier
The JavaScript n* quantifier is used when we need to match a string that contains zero, one, or more occurrences of n, where n refers to a character. For example:
<!DOCTYPE html> <html> <body> <p id="abc"></p> <script> let myString = "Hellloooo Prooogrammer, Helloo Hello"; let pattern = /o*/gi; document.getElementById("abc").innerHTML = myString.match(pattern); </script> </body> </html>
Let me create another example that uses multiple character patterns that are ll and lo:
<!DOCTYPE html> <html> <body> <p>Matches with <b>ll*</b> = <b><span id="a"></span></b></p> <p>Matches with <b>lo*</b> = <b><span id="b"></span></b></p> <script> let myString = "Hellloooo Prooogrammer, Helloo Hello"; let patternOne = /ll*/gi; let patternTwo = /lo*/gi; document.getElementById("a").innerHTML = myString.match(patternOne); document.getElementById("b").innerHTML = myString.match(patternTwo); </script> </body> </html>
Matches with ll* =
Matches with lo* =
In above example, the first pattern, that is, ll* finds strings containing l followed by zero, one or more occurrences of l. Whereas in the second pattern, that is lo* finds string containing l followed by zero, one, or more o.
The n? Quantifier
The JavaScript n? quantifier is used when we need to match a string containing zero or one occurrence of n, where n refers to a character. For example:
<!DOCTYPE html> <html> <body> <p>Matches with <b>j?</b> = <b><span id="a"></span></b></p> <p>Matches with <b>va?</b> = <b><span id="b"></span></b></p> <script> let myString = "JavaScript and Javaa are Fun to Learn."; let patternOne = /j?/gi; let patternTwo = /va?/gi; document.getElementById("a").innerHTML = myString.match(patternOne); document.getElementById("b").innerHTML = myString.match(patternTwo); </script> </body> </html>
Matches with j? =
Matches with va? =
The n{X} Quantifier
The JavaScript n{X} quantifier is used when we need to match a string that contains X sequence of n, where X refers to a number. For example:
<!DOCTYPE html> <html> <body> <p id="myPara"></p> <script> let myString = "10 or 100 or 200 or 300 or 5555"; let pattern = /\d{3}/g; document.getElementById("myPara").innerHTML = myString.match(pattern); </script> </body> </html>
In above example, in the following JavaScript code snippet:
/\d{3}/g
d indicates to a number, therefore d{3} matches a sequence having at least 3 digits.
The n{X,Y} Quantifier
Similar to n{X}, the n{X,Y} quantifier is used when we need to match a sequence having atleast X and Y number of digits. For example:
<!DOCTYPE html> <html> <body> <p id="res"></p> <script> let myString = "10 or 100 or 200 or 300 or 5555"; let pattern = /\d{2,3}/g; document.getElementById("res").innerHTML = myString.match(pattern); </script> </body> </html>
The n{X,} Quantifier
Similar to n{X}, the n{X,} quantifier does the same job, except that, it gets/prints the complete number containing at least X number of digits. For example:
<!DOCTYPE html> <html> <body> <p id="resPara"></p> <script> let myString = "10 or 100 or 200 or 300 or 5555"; let pattern = /\d{3,}/g; document.getElementById("resPara").innerHTML = myString.match(pattern); </script> </body> </html>
The n$ Quantifier
The JavaScript n$ quantifier is used when we need to match whether specified string ends with n or not, where n refers to a single or multiple character(s). For example:
<!DOCTYPE html> <html> <body> <p id="mp"></p> <script> let myString = "JavaScript is Fun"; let pattern = /Fun$/; document.getElementById("mp").innerHTML = myString.match(pattern); </script> </body> </html>
The ^n Quantifier
Unlike n$, the ^n quantifier is used when we need to match if a specified string begins with n. For example:
<!DOCTYPE html> <html> <body> <p id="rs"></p> <script> let myString = "JavaScript is Fun"; let pattern = /^J/; document.getElementById("rs").innerHTML = myString.match(pattern); </script> </body> </html>
The ?=n Quantifier
The ?=n quantifier is used when we need to match a string with the pattern: a specified string followed by n (an another specified string). For example:
<!DOCTYPE html> <html> <body> <p id="mpr"></p> <script> let myString = "Today I feel encouraged!"; let pattern = /I(?= feel)/; document.getElementById("mpr").innerHTML = myString.match(pattern); </script> </body> </html>
The ?!n Quantifier
Unlike ?=n, the ?!n quantifier is used when we need to check if a specified string is not followed by n (another specified string). For example:
<!DOCTYPE html> <html> <body> <p id="fresherearth"></p> <script> let myString = "JavaScript is Fun. Is not it?"; let pattern = /is(?! Fun)/gi; document.getElementById("fresherearth").innerHTML = myString.match(pattern); </script> </body> </html>
Since there is one Is which is not followed by Fun. Therefore the above program has produced Is as output.
« Previous Tutorial Next Tutorial »