Regular Expressions in Javascript Tutorial

Regular expressions are used in a text search technique called "pattern matching." A regular expression is a pattern of characters following a specialized syntax used to search text for a matching pattern. Regular expressions can be used to find single characters, words, and complex patterns of characters. Pattern matching and regular expressions are commonly used in JavaScript for form validation, replacing text, processing user input, and parsing text. Construct a regular expression for the pattern you want to match, and use it with JavaScript methods to find matching strings in text.

Constructing Regular Expressions

Step 1

Search for a string at the beginning of the text by placing a caret (^) at the beginning, or at the end of the text by placing a dollar sign ($) at the end:

^Fred matches "Fred went to the store"

Fred$ matches "Betty called Fred"

^Fred$ matches "Fred"

Step 2

Use square brackets ([]) to provide a list or a range of characters to match. List all the characters to match, or provide the first and last character in the range separated by a dash (-):

[aeiou] matches a vowel

[2-7] matches a digit in the range 2 to 7, inclusive

[0-9a-zA-Z] matches any alphanumeric character

Step 3

Match a specific number of characters by providing the count, or minimum and maximum, in curly brackets ({}):

co{2}t matches "coot"

co{1,2}t matches "cot" and "coot" (at least one, at most two "o"s)

[1-9]{3} matches any string of three digits in the range one to nine

The question mark (?), plus sign (+), and asterisk (*) are special shortcuts for commonly used count ranges.

? matches zero or one (co?at matches "cat" and "coat")

+ matches one or more (co+at matches "coat" and "coooat")

* matches zero or more (co*at matches "cat" and "coooooat")

Step 4

Create a list of strings to match, enclosed in parentheses (()) and separated with a pipe (|). The ?, +, and * can be used to match the strings:

(agri|counter)+culture matches "agriculture" and "counterculture"

Step 5

Match special characters by "escaping" them with a backslash (\):

^\$\$\$$ matches "$$$"

what\?$ matches "Say what?"

Using Regular Expressions

Step 1

Declare a regular expression object, placing your regular expression between two forward slashes (/regex/), followed by optional flags. The flags are "g" for "global" (find all matches), "i" for case insensitive matching, and "m" to set ^ and $ to match the beginning and end of lines. For example:

var expr = /(no|n)/ig ;

Step 2

Use the regular expression's "test" method to check for a match. The "test" method returns a boolean (true or false). In this if-block, the test returns true, and the block is executed:

if (expr.test("No")) { ... }

Step 3

Use String's "match" method to get the first match, or all of the matches if the "g" flag was used, passing the regular expression as the parameter. This example returns all three occurrences of "No" in an array:

var str = "No! No! No!" ;

var result = str.match (expr) ;

Step 4

Use the String "replace" method replace the matches in the string with the string provided as the second parameter. After this line, "str" contains the string "Yes! Yes! Yes!":

str = str.replace (expr, "Yes") ;

References

Resources

About the Author

Deborah Lee Soltesz is a web developer who has been creating web sites, promotional materials and information products for over 20 years. Soltesz has a Bachelor of Science in computer science and engineering, and has worked in earth and space science research for over a decade writing for scientific and general audiences.

Photo Credits

vintage bible book studio isolated image by dinostock from Fotolia.com