Regular Expressions explained

Text Javascript

Author: liorean (evolt@liorean.f2o.org); 09/09/2002; found in Code, 4umi edited.

What is a regular expression?

Regular expressions are patterns of characters, character sequences that may of may not occur in a given textual content. Take for example the DOS wildcards ? and * when searching for a file which have been commonly used since computers became mainstream articles. That is a kind of very limited subset of RegExp. For instance, if you want to find all files beginning with foo, followed by 1 to 4 random characters, and ending with .txt, you can't do that with the usual DOS wildcards. RegExp, on the other hand, could handle that and much more complicated patterns.

Regular expressions are, in short, a way to effectively handle data, search and replace strings, and provide extended string handling. Often a regular expression can in itself provide string handling that other functionalities such as the built-in string methods and properties can only do if you use them in a complicated function or loop.

Various programming languages implement regular expressions, with some differences between them. In Javascript, support starts with version 1.2, which comes with Internet Explorer 4 and better, and Netscape 4 and better.

RegExp syntax

There are two ways of defining regular expressions in Javascript: one through an object constructor and one through a literal. The object can be changed at runtime, but the literal is compiled at load of the script, and provides better performance. So the literal is the best to use with known regular expressions, but the constructor allows for dynamically constructed regular expressions such as those from user input. In almost all cases you can use either way to define a regular expression, and they will be handled in exactly the same way no matter how you declare them.

Declaring a literal

Like a string variable is declared by putting some text between quotation marks (either the single (') or the double (") variant), RegExp literals are delimited by the forward slash character / in Javascript. This may be confusing at first as it is a quite unusual writing method. Other languages such as PHP or VBScript use other characters for the same purpose in their regular expressions. Any flags go immediately after the closing slash.

• /pattern/flags

var re = /mac|win/i;
/^(\d\d)([-:\/])(\d\d)\2(\d\d)$/.exec( '02:22:44' );
/[\u0024\u20ac]\s*\d+/.test( somemoneystring );
'God save the the Queen'.match( /\b(\w+)\b\s+\1/g );

Extended characters may be entered in the pattern through their Unicode number. In the example above, \u0024 is the dollar, \u20ac is the €.

Declaring an object

To create a regular expression at runtime, a new RegExp() object is called with two parameters, the first the pattern, the second the flags, both as type string. If no flags are required, the second parameter can be left out. Since backslashes are used to escape special characters in strings as well as in regular expressions, they must be escaped themselves with another backslash to make it to the expression.

• new RegExp( 'pattern', 'flags' );

var re = new RegExp( '\\d{' + min + ',' + max + '}' );
var re = new RegExp( '\\b' + window.prompt( 'Your word:', 'example' ) + '\\b', 'gi' );
var re = new RegExp( new Date().getDate() + ' (\\w) ' + new Date().getFullYear(), 'g' );

Flags

There are three flags that you may use on a RegExp. The multiline flag has bad support in older browsers, but the other two are supported in pretty much every browser that can handle RegExp.

Flags are an itegral part of the expression. They cannot be changed or set after the object has been created.

Pattern

The patterns used in RegExp can be very simple, or very complicated, depending on what you're trying to accomplish. To match a simple string like 'Hello World!' is no harder then actually writing the string, but if you want to match an e-mail address or html tag, you might end up with a very complicated pattern that will use most of the syntax presented in the table below.

Usage

Now, knowing how a RegExp is written is only half the game. To gain anything from them you have to know how to use them too. There are a number of ways to implement a RegExp, some through methods belonging to the String object, some through methods belonging to the RegExp object. Whether the regular expression is declared through an object constructor or a literal makes no difference as to the usage.

RegExp.exec( string )
//Applies the RegExp to the given string, and returns the match information.

RegExp.test( string )
//Returns a boolean true if the given string matches the Regexp, false if not.

String.match( pattern )
//Matches given string with the RegExp. With 'g' flag returns an array
//  containing all matches, without 'g' flag returns just the first match or
//  if no match is found returns null.

String.search( pattern )
//Returns the index of the beginning of the match if found, -1 if not.

String.replace( pattern, string )
//Returns a string where matches have been replaced with the given string.

String.split( pattern )
//Cuts a string into an array, making cuts at the matches.