Explore the Regex Side of jQuery

jquery buttonjQuery is a famous cross-platform client-side scripting language used in more than 80% of websites over the globe. It is a JavaScript library that handles events, DOM, effects and AJAX. You and use the jQuery file by linking a copy of it to your web page. jQuery files are available on a lot of cloud servers. The jQuery library simplifies syntax and helps ease navigation and handle events and asynchronous applications.

Regex can be a string, a literal or a string pattern that is compared to another string or a part of a string. Regex or “regular expressions” are not a part of jQuery library but are a part of JavaScript. jQuery has different regex comparisons or execution syntax. Regex expressions are widely used for validation and syntax highlighting.

Want to learn jQuery? Take up a tutorial at Udemy.com

Regex strings or patterns are a combination of the following.

  1. Pattern Modifiers
  2. Anchors
  3. Brackets
  4. Quantifiers
  5. Meta characters

Pattern Modifiers 

Pattern modifiers are used to perform global matches and matches that are case-insensitive.

The basic pattern modifiers are

1) i – This is used to perform a match that is case-insensitive

Syntax – /Pattern/i

Example – /hello/i in “Hello world” will match “Hello world”.

/hello/ in “Hello world” will not match.

2) g – This modifier is used to perform a match globally and not stop after the first match.

Syntax – /Pattern/g

Example – /is/g in “This is regex tutorial” will match “This is regex tutorial”.

/is/ in “This is regex tutorial” will match “This is regex tutorial”.

3) m- This modifier is used to perform a multiline match at the beginning of each line for the given string.

Syntax – /Pattern/m

Example – who/m in “\nWho are you?\nwho is he?” will match \nWho is that?\nwho are you?.

Anchors 

Anchors are used to match the positions of the characters for the space before, after or in between characters.

Learn the fundamentals of jQuery at Udemy.com
Start and End of Line Characters in the String:

1) ^ – This is used to match the first character in each line.

Syntax – ^pattern

Example –

^hello in “hello world \nregex” will match in “hello world \nregex”
^r in “hello world \nregex” will match in “hello world \nregex”
^w in hello world \nregex will not result in any match

2) $ – This is used to match the last character in each line.

Syntax – pattern$

Example –

world$ in “hello world \nregex” will result in “hello world \nregex”
x$ in “hello world \nregex” will match in “hello world \nregex
o$ in “hello world \nregex” will not result in any match

Brackets 

Brackets perform matches for a range of strings or pattern.

Syntax – [pattern]

Example –

[hd] in “hello world” will match “hello world” (Match characters between the brackets)

[^hd] in “hello world” will match “hello world” (Match characters excluding the ones inside the brackets.)

[a|e] in “hello world” will match “hello world” (Match for either a or e).

[0-5] in “0123456789” will match “01234567890“(match for digits in the range 0 to 5).

[.-a-d] in “hello world” will match “hello world” (Match for ‘.’ and for characters in the range a to d but not A to D).

NOTE –

(-) in brackets are used to denote the range of characters.

If you want to match any literal it should be added first within the bracket.

Quantifiers

Quantifiers are used to perform matches based on certain criteria defined.

1) Match for character with at least one occurrence

Syntax – pattern+

Example –

o+ in “hello regex” will match “hello regex”

2) Match for character based on conditions within the brackets.

Syntax – character{}

Example –

o{4} in “helloooo wooorld” will match “helloooo wooorld” (Match for character with the number of occurrences within the bracket).

o{2,4} in “helloooo wooorld” will match “helloooo wooorld” (Match for character with the number of occurrences within the range in the bracket).

o{4,} in “helloooo wooorld” will match “helloooo wooorld” (Match for character with at least the number of occurrences within the bracket).

3) Match for string that is followed by the specific string

Syntax – pattern(?= specificString)

Example –

is(?= regex) in “This is regex” will match “hello is world” (Match for string “is” which is followed by the specific string “regex”)

is(?=This) in “hello is world” will not match. (Match for string “is” which is followed by the specific string “This”)

4) Match for string that is followed by the specific string

Syntax – pattern(?! specificString)

Example –

is(?! This) in “This is regex” will match “This is regex” (Match for string “is” which is not followed by the specific string “This”)

is(?! regex) in “This is regex” will not match. (Match for string “is” which is not followed by the specific string “regex”)

Learn jQuery from scratch at Udemy.com

Meta Characters 

These are used to match characters with a special meaning.

.           single string, except \n or \r

\w        word

\W       non-word

\d         digit

\D        non-digit

\s          whitespace

\S         non-whitespace

\b         match in the beginning/end of a word

\B        match not from the beginning/end of a word but globally

NULL

\n         new line

\f          form feed

\r          carriage return

\t          tab

\v         vertical tab

Steps to Implement Regex in JQuery Code :

Regex can be implemented using two methods:

1) test

This method is used to test the match between the given regex pattern and the comparison string. This method returns either true or false.

Syntax –

var compareString = “String to be compared”;

var pattern = “Pattern”;

var matchResult = pattern.test(compareString);

Example –

1)    var str = “Hello world”;

var patt = /e/;

var res = patt.test(str);

Here, the res variable will have the value true.

2)   var str = “world”;

var patt = /e/;

var res = patt.test(str);

Here res will have the value false

2) Match

This method is used to match the comparison string with the regular expression pattern and return an array of the matched strings or null if there are no matches.

Syntax –

var compareString = “String to be compared”;

var pattern = “Pattern”;

var matchResult = compareString.test(pattern);

Examples –

var str = “The objective of the article is to explain about regex”;

var patt =/the/gi;

var res = str.match(patt);

In the above example, res will have the value “The, the”

var str = “The objective of the article is to explain about regex”;

var patt =/an/gi;

var res = str.match(patt);

In the above example, res will have the value null.