Quantifiers +, *, ? and {n}\

In JavaScript, quantifiers are used for specifying the numbers of characters or expressions to match.

To a better understanding, imagine having a string like +3-404-777-41-32 and want to find all the full numbers in it: 3, 404, 777, 41, 32.

A number is known as a sequence of one or more digits \d. Quantifiers are used for marking how many of them you need.

Quantity¶

A number in curly braces {n} is the simplest quantifier.

A quantifier, first, is appended to a character and then indicates how many you need.

Let’s consider an example where the exact count is 3.

\d{3} signifies exactly five digits like \d\d\d\d\d.

Now, let’s try to search for a three-digit number like this:

console.log("It's 651 years old".match(/\d{3}/)); //  "651"

For excluding longer numbers, you can add \b .

Now let’s see an example where the range is {2,5} , the match: 2-5 times.

So, for finding the numbers from 2 to 5, it is necessary to act like this:

console.log("It's not 4, but 675 years old".match(/\d{2,5}/)); // "675"

The upper limit can be omitted.

Afterward, a regular expression \d{4,} searches for digit sequences of length 4 or more, as follows:

console.log("It's not 23, but 856247 years old".match(/\d{4,}/)); // "856247"

Returning to the string +3-404-777-41-32 , let’s try something else.

As a number is a sequence of a single or more digits in a row, then, in the example below, the regexp will be \d{1,}:

let str = "+3-404-777-41-32";

let numbers = str.match(/\d{1,}/g);

console.log(numbers); // 3,404,777,41,32

Shorthands¶

For the most used quantifiers, you can use shorthands to make your work easier.

The + shorthand is equivalent to {1,}, meaning one or more.

For example, \d+ will search for numbers.

The ? shorthand is equivalent to {0,1}, meaning zero or one. That is, it makes the symbol optional.

For example, the pattern ou?r searches for o, followed by zero or one u, and then r.

So, in the example below, worl?d finds both word and world:

let str = "these words are very demanded in the world";

console.log(str.match(/worl?d/g)); // word, world

The * shorthand is equivalent to {0,}, meaning zero or more. In other words, the character can be absent or repeat at any time.

For instance, \d0* will search for a digit, followed by any number of zeros, like here:

console.log("200 20 2".match(/\d0*/g)); // 200, 20, 2

Other Examples¶

Qualifiers are used quite commonly in every developer’s practice. Let’s see more examples that you may come across during your work.

An example of a regular expression for decimal fractions will look as follows: \d+\.\d+.

Its action is:

console.log("0 2 24.745 6798".match(/\d+\.\d+/g)); // 24.745

Let’s see an example of a regexp for an opening HTML-tag without attributes. For instance, <span> or <p>.

The simplest version is /<[a-z]+>/i:

alert("<div> ... </div>".match(/<[a-z]+>/gi)); // <div>

A complex one will be /<[a-z][a-z0-9]*>/i:

alert("<p>Welcome</p>".match(/<[a-z][a-z0-9]*>/gi)); // <p>

And, finally, a regular expression closing or opening HTML-tag without attributes: /<\ ?[a-z][a-z0-9]*>/i

An optional slash /? is added near the start of the pattern. It is necessary to escape it using a backslash. Otherwise, JavaScript will think it’s the end of the pattern:

alert("<p>Welcome</p>".match(/<\/?[a-z][a-z0-9]*>/gi)); // <p>, </p>

So, from this chapter, we can see a common rule: the more precise is a regexp, the more complicated it is.