Regular Expressions in JavaScript

Introduction to Regular Expressions in JavaScript

Regular expressions are a string of characters that are used to validate the contents of another string. These strings of characters that form the regular expression are stored in an object.

Syntax

var regEx = /^[A-Za-z]/;

Here the variable object named “regEx” holds the regular expression pattern. Now let’s test if another string matches this regular expression.

Code

var str = "EduCBA";
var regEx = /^[A-Za-z]/;
var res = "false";
if(str.match(regEx)){
res= "true";
}
alert(res);

Output:

true

Here in the above example, the regular expression checks whether a string contains only alphabets A through Z in both upper and lower cases. If it does, it returns “true”, if not “false”.

Regular Expression Syntax in JavaScript

A regular expression consists of two parts. The first part is the pattern, which is followed by an optional flag.

Syntax

var regEx = /pattern/flag

Flags are also referred to as modifiers. Few commonly used optional flags are

g – global

Finds multiple matches. If not used, it stops after the first match.

Code

var str = "I scream, you scream, we all scream for ice cream";
var regEx = / scream/g;
var result = str.match(regEx);
alert( result );

Output:

scream, scream, scream // It returns all the matches in the string.

i – ignore-case

This is case insensitive and matches both upper and lower cases. If not set, then the search is case-sensitive.

Code

var str = "Hello EduCBA";
var regEx = /educba/i;
alert( str.search(regEx) );

Output:

6 //returns the index at which the string is found.

alert( str.search(/educba/) ); //without global flag

Output:

-1

m – multi-line

It affects the behavior of characters “^” and “$”. In the case of multi-line, it looks for matches at the start and end of each line rather than that of the entire string. If it isn’t in multi-line mode, then only the matches from the entire string are returned.

Code

var str = `I scream,
you scream,
we all scream for ice cream`;
var regEx = /^\w+/gm;
var result = str.match(regEx);
alert( result );

Output:

I,you,we  //prints the first word of every line.

Now, let us take a look at the patterns in the regular expression. The pattern consists of ranges, metacharacters, quantifiers, etc.

Metacharacters of Regular Expressions in JavaScript

The metacharacters form the base of the regular expression pattern. These are a combination of backward slash with an alphabetical character which together forms a metacharacter, and each of them has a special meaning associated with each of them. For example, “\n” denotes a new line. A few other examples of metacharacters are.

1. \t – used to find a tab character.
2. \v – used to find a vertical tab character.
3. \s – used to find white space characters.
4. \S – used to find non-whitespace characters.
5. \d – used to find numerical digits.
6. \D – used to find nun – numeric digits.
7. \w – used to find words.
8. \W – used to find anything except for words.
9. . – a dot is used to find a single character other than the newline or end of the line.
10. \0 – used to find a null character.

Sets and Ranges of Regular Expressions in JavaScript

In this scenario, square brackets are used as part

Syntax

Say, for the set [abc] – only the characters a, b and c are to be considered.

Example 1

1. [^abc] – that is any character other than abc.
2. [a|b] – Either a or b can be considered.

A range is provided between that range; all the characters are to be considered. For example: [a-z] means all characters from a through z in lower case will be taken into consideration.

Example 2

1. [0-9] – all characters from zero through nine.
2. [A-Z] – all character from A to Z in upper case.

Quantifiers of Regular Expressions in JavaScript

These are denoted with the help of special characters. Each special character has a meaning associated with it. These characters are used along with regular expressions.  A few of the most used quantifiers are:

1. * – Matches a string containing zero or more instances.
2. + – Matches a string containing one or more instances.
3. ? – Matches a string containing zero or one instance.
4. {n} – Here, “n” takes in a number. Matches the required regular expression the number of times mentioned in place of “n”.
5. $ – Matches the given expression with the end of the string.
6. ^ – Matches the given expression with the beginning of the string.
7. ?= – Matches any string with the regex pattern after the equals sign.
8. ?! – Matches any string that does not contain the regex pattern after the exclamatory sign.

Properties of Regular Expressions in JavaScript

It consists of the following properties:

1. Constructors – Determines which function has created the regular expression object prototype.
2. Global – Checks whether the flag “g” is set.
3. Ignore case – Checks whether the flag “i” has been set.
4. The last Index – Determines the index position at which the next match needs to start from.
5. Multiline – Checks whether the flag “m” has been set.
6. Source – Gives the text of the regular expression pattern.

Methods in Regular Expressions and Strings

Commonly used methods in regular expressions

1. exec() – Executes to look for matches in a string and returns the first match. If no match is found, then it returns null.
2. test() – Tests for matches in a string and returns the result in the form of Boolean. That is, if a match is found, it returns true; if not, then it returns false.
3. toString() – Returns an equivalent string object of the regular expression.

String methods that are useful when working with regular expressions

1. match() – It’s a String method that looks for a match in a string. If found returns the match; if not, then returns null.
2. matchAll() – It’s a String method that looks for all the matches in a string.
3. split() – It’s a string method used to break a string based on the regular expression provided.
4. search() – It’s a string method used to look for a match against the given regular expression. Returns 0 on success and -1 on failure.

Conclusion

Regular expressions can be written by making use of different combinations of metacharacters, quantifiers, and flags whenever required. They also come with their own set of methods and also work well with commonly used string methods. One could easily use them for validation or content restriction as per one’s requirement.

Recommended Articles

This has been a guide to Regular Expressions in JavaScript. Here we have discussed Syntax to Regular Expressions in JavaScript, metacharacters, sets and ranges, quantifiers, properties, methods with outputs. You can also go through our given articles to learn more-

1. How JavaScript Works
2. What is JavaScript?
3. How to Install JavaScript
4. Introduction To JavaScript