Regular Expression in Javascript - Getting Started


Javascript is an easy-to-use programming language that can be embedded within web pages. It runs on the client machine instead of the server machine. This leads to a big advantage that the server is freed from the calculations that it would have to do, had the script been running on server machine in place of the client machine. Unless you are concerned about proprietary code, you should program as much of your script in javascript as possible.

1.1 Your First Regular Expression Script


We will start with a simple example to get started quickly. You do not need any compiler or interpreter to start learning javascript. Your html browser has the ability to interpret your script. Just write the following code in a file ending with extension .htm. Double clicking the file will open in your browser and you can see the javascript in action.


<html>
<body>
<script type="text/javascript">
<!--
/*
********************************************************
Javascript Regular Expression Example1
Find if a pattern matches
********************************************************
*/
var pattern1=new RegExp(".com");
var string1 = "My email is xyz@yahoo.com";
if (pattern1.test(string1))
{
document.write("OK good");
}
else
{
document.write("Your email must have a .com");
}
//-->
</script>
</body>
</html>

Try this Example online


The best way to learn is to try the example, make changes and see it effect. You can do it online - At Example 1 link here .

The most basic use of regular expression is to find if a pattern matches in a string. In the above example we have a very crude method of finding if a person entered his valid email by checking if there is a .com in the string. A real world checking for a valid email is more complicated than this, as we will see later. But for our immediate understanding let us see how we can find if a string contains a pattern .com.

We define the pattern that we need to search using the expression such as

var pattern1=new RegExp(".com");


This code defines a RegExp object called pattern1 with the pattern ".com": To search for the pattern contained in the variable pattern1, we invoke the method "test". Let us take a look at the following code

var string1 = "My email is xyz@yahoo.com";
if (pattern1.test(string1))


We try to find if string1 contains the pattern contained in variable pattern1 by evaluating the expression pattern1.test(string1). In this example the result is true and the javascript code prints "OK good". You will recall that the statement document.write() writes the string on the screen. If we however, change the statement

var string1 = "xyz@yahoo.com";


to

var string1 = "xyz@yahoo.org";
then, keeping everything else the same the script will give the output

"Your email must have a .com".

The complete program is shown given below

<html>
<body>
<script type="text/javascript">
<!--
/*
********************************************************
Javascript Regular Expression Example 2
Effect of Change in String
********************************************************
*/
var pattern1=new RegExp(".com");
var string1 = "xyz@yahoo.org";
if (pattern1.test(string1))
{
document.write("OK good");
}< br />else
{
document.write("Your email must have a .com");
}
//-->
</script>
</body>
</html>
Try this example online - here .

The only change in the above example as compared to the previous example is that we have changed

var string1 = "xyz@yahoo.com"; 


to

var string1 = "xyz@yahoo.org";


What we have learnt

1. The RegEx object is used to create a pattern that is to be searched in a string.
2. The method test() of object RegEx is used to find if a given pattern is contained in a string.