Click here to Skip to main content
Click here to Skip to main content

Simple and Useful JavaScript Regular Expression Tutorial

, 16 Jul 2012
Rate this:
Please Sign up or sign in to vote.
This post discusses some simple and useful JavaScript Regular Expressions

Introduction

Regular Expression is a very important part of any language programming because of its ability to help programmers to write fast and pure applications.

You Don't Know What a Regular Expression Is?

A regular expression is an object that describes a pattern of characters.

Regular expressions are used to perform pattern-matching and "search-and-replace" functions on text. 

Web developer can also use Regular Expression in JavaScript. Now I describe some simple examples of using Regular Expression in JavaScript.

The overall syntax should look like:

/pattern/modifiers

  • pattern specifies the search pattern
  • modifiers specify if our search should be case-sensitive, global, etc.

Modifiers Table

Modifier Description
i Perform case-insensitive matching
g Perform a global match (find all matches rather than stopping after the first match)
m Perform multiline matching

To compile and use Regular Expression, you can use three useful functions.

Regular Expression Object Methods

Method Description
compile() Compiles a regular expression
exec() Tests for a match in a string. Returns the first match
test() Tests for a match in a string. Returns true or false

Character Escapes  (Metacharacters)

Metacharacter  Description
Find a single character, except newline or line terminator 
\w Find a word character 
\W  Find a non-word character 
\d Find a digit 
\D Find a non-digit character 
\s Find a whitespace character 
\S Find a non-whitespace character 
\b Find a match at the beginning/end of a word 
\B Find a match not at the beginning/end of a word 
\0  Find a NUL character
\n Find a new line character 
\f  Find a form feed character 
\r  Find a carriage return character 
\t  Find a tab character 
\v  Find a vertical tab character 
\xxx Find the character specified by an octal number xxx 
\xdd Find the character specified by a hexadecimal number dd 
\uxxxx Find the Unicode character specified by a hexadecimal number xxxx 

Metacharacter table from W3Schools.  

Example 

Test sentence: Sometext sometext sometext

Expression Test Result
/sometext/ Sometext sometext sometext
/sometext/i Sometext sometext sometext
/sometext/g Sometext sometext sometext
/sometext/gi Sometext sometext sometext
/some/ Sometext sometext sometext
/some/i Sometext sometext sometext
/some/g Sometext sometext sometext
/some/ig Sometext sometext sometext

It's easy!

In the next article, I will show you Regular Expression performance in some cases and also how to make simple and pure Regular Expressions.

History

  • 19 May, 2011: Initial version.
  • 1 June, 2011: Added sample source code.
  • 16 July, 2012: Add metacharacters table.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

About the Author

Afshin Mehrabani
CEO usabli.ca
Iran (Islamic Republic Of) Iran (Islamic Republic Of)
I am a web developer, the co-founder of usabli.ca.
I love programming and also new technologies on Web Developing such as HTML5 and I always split my time between programming and reading.
Follow on   Twitter   Google+

Comments and Discussions

 
GeneralMy vote of 5 PinmemberAbdul Quader Mamun14-Aug-12 2:28 
QuestionNot an article PinmemberGanesanSenthilvel16-Jul-12 2:48 
QuestionRe: Not an article PinmemberAfshin Mehrabani16-Jul-12 5:11 
GeneralMy vote of 1 PinmvpDave Kreskowiak16-Jul-12 1:46 
GeneralMy vote of 1 Pinmemberdavidlow7023-May-11 14:14 
GeneralThanks PinmemberAhmad Hyari21-May-11 8:39 
GeneralMy vote of 3 PinmvpAspDotNetDev20-May-11 10:37 
This is far too short and superficial to be an article. It would work better as a tip/trick. If you want to make it an article, go into more detail and provide a functional code sample to download. You should in the very least show a complete JavaScript snippet; As it stands, you just show a few sample regular expressions. If you decide to make this full article, you may want to add some nuances, such as how to escape characters (e.g., how would you do a regex that finds a forward slash). You also do not cover how to replace text using a regex, though you mention it at the top. Seeing a snippet that actually gets the result of the regex would be nice (e.g., output each matched item into LI's in a UL). And if you do create a more complete example with some useful output, make sure to take a screenshot and show that as well. Oh, I also saw no mention of how to get all matches (you say that "exec" gets the first match, but there must be a function to get all matches, or so I would think). Be sure to include mention of what the functions take as parameters and what the output is (e.g., string, boolean, array). One more small note: what are "pure applications" and "pure regular expressions"? Perhaps "pure" is not the word you are looking for.
GeneralRe: My vote of 3 PinmemberAfshin Mehrabani21-May-11 6:28 
GeneralRe: My vote of 3 Pinmemberdavidlow7023-May-11 14:21 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Mobile
Web02 | 2.8.140721.1 | Last Updated 16 Jul 2012
Article Copyright 2011 by Afshin Mehrabani
Everything else Copyright © CodeProject, 1999-2014
Terms of Service
Layout: fixed | fluid