JavaScript Regex Quantifiers

Chapter 4 10 mins

Learning outcomes:

  1. What are quantifiers
  2. How to use quantifiers

Introduction

Regular expressions are fairly monotonous and tiring without the use of a special concept known as quantifiers. Quantifiers serve to make a pattern replicated a given number of times. If you were ever asked to match the character 'a' occurring for 100 times contiguously, in a test string, will you construct an expression with literallt 100 a's or something more efficient!

In this chapter we will discover quantifiers in great detail and see tons of examples on the topic. So let's not waste any more time and begin right away.

What are quantifiers?

As the name suggests, quantifiers are special characters that,

Serve to quantify a given pattern. By 'quantify' we mean that the pattern is replicated for a certain number of times.

More specifically, quantifiers don't just quantify some given pattern, but instead the pattern immediately preceding them. Therefore where we need to match a pattern appearing contiguously for n number of times, we can use quantifiers, instead of manually retyping the pattern that many times.

Take the example of the quantifier +. It takes its preceding pattern and quantifies it for one or more number of times. What this means is that the expression /a+/ will match the strings 'a', 'aa', 'aaa' and so on, since the pattern preceding +, which is a, will be looked for one or a greater number of times in the test string.

Similarly /ca+t/ will match the strings 'cat', 'caat', 'caaat', 'caaaat', and so on. The expression will look for a c followed by a, one or a multiple number of times, and then finally t. At t the searching will end and hence we will get the matched substring returned.

In both of these expressions we say that a has been quantified by the + quantifier whose range is from 1 to Infinity (we will see how ranges work just in a short while below).

Regular expressions come equipped with far more quantifiers than just the + quantifier. A complete list is given below. We'll work with each and every quantifier shown here in the examples that follow.

QuantiferMeaning
+Matches its preceding pattern for one or more number of times.
*Matches its preceding pattern for zero or more number of times.
?Matches its preceding pattern for zero or one number of times.
{n}Matches its preceding pattern exactly for n number of times.
{m,n}Matches its preceding pattern for m to n number of times.
{n,}Matches its preceding pattern for n or more number of times.

Zero or more

The quantifier * looks for its preceding pattern zero or more times.

Unlike +, it matches even those substrings where the preceding expression never appears. It has the range 0-∞.

For example /ca*t/ matches the strings 'ct', 'cat', 'caat', 'caaat' and so on. Notice the first match here i.e 'ct', it has zero occurrences of the character a and will only match the quantifier *, BUT NOT +.

+ needs at least ONE occurence of its preceding character whereas * needs, at least, NONE of it.

Construct an expression to match all sequences in a string that follow the pattern: 'a' followed by none or more repetitions of 'n' followed by 't'.

'n' can appear for zero or more number of times hence it requires the quantifier *. The rest of expression then becomes pretty straightforward to layout. We need to match for all such occurrences therefore need the g flag. The final expression is thus /an*t/g.

Zero or one

The quantifier ? looks for its preceding pattern for zero or one occurrences. This means it has the range 0-1.

The expression /ca?t/ will hence only match the strings 'ct' and 'cat', with zero and one occurence of 'a' in the test strings respectively.

Construct an expression to match the sequence: an 'a' followed by an 's', occurring once or never.

The expression is /as?/ as we need to look for s once or never, using the quantifier ?.

Custom ranges

Besides these predefined ranges of the quantifiers +, * and ?, in regular expressions, we also get the chance to set custom quantified ranges. They are given by curly braces {} and at least one number.

Here's how custom ranges work.

If we specify only a single value inside the braces, such as {5}, then the preceding character is looked for exactly that number of times in the test string.

On the other hand if we specify a comma inside the braces with at least one number on its left, as in {1,2} we set up a range. This range starts at the number before the comma and ends at the one after it, if it is given.

Omitting the ending value after the comma, like in {0,} makes an open-range quantifier after the starting value i.e it goes all the way to infinity.

All this is illustrated as follows.

Write an expression to find the following sequence in a string: 'c', then an 'a' exactly for 100 times and finally 't'.

'a' shall appear exactly for 100 times so we use the {100} quantifier. Thus the final expression becomes /ca{100}t/.

Write an expression to find the following sequence in a string: 'c', then an 'a' for 3-12 times and finally 't'.

'a' shall appear for 3-12 times so we use the {3,12} quantifier. Thus the final expression becomes /ca{3,12}t/.

Write an expression to find the following sequence in a string: 'c', then an 'a' for 10 or more number of times and finally 't'.

'a' shall appear for 10 or more number of times so we use the {10,} open-range quantifier. Thus the final expression becomes /ca{10,}t/.

And essentially this is all what we get as quantifiers in regular expressions to work with. As you might appreciate from this chapter, the strength of regular expressions lies in the concept of quantification. Without it we aren't much in control over matching complex patterns - manual repetition can be saved by quantifying stuff when the need is to look for a pattern n number of times.

Following we have a good handful of tasks for you to be able to better understand quantifiers and use them easily and smoothly in solving regexp problems before proceeding on with this course.

Write an expression to find the following sequence in a string: '1' (one or more times), followed by '0' (3 or more times) and finally '2' (exactly for 3 times).

Just follow along the requirements of each digit and create quantifiers as you do so. '1' should appear one or more times hence its quantification is 1+. '0' should appear 3 or more times hence in expression it becomes 0{3,}. '2' should appear for exactly for 3 times hence 2{3}.

Combining all this we arrive at /1+0{3,}2{3}/

"I created Codeguage to save you from falling into the same learning conundrums that I fell into."

— Bilal Adnan, Founder of Codeguage