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 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

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. 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 it 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-white space 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 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.

Examples 1

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

In the case of ranges, 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.

Examples 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.  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

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 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 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