Using ECMAScript String Regular Expressions

ECMAScript String Regular Expressions – Part 7

Forward: In this part of the series, we shall learn two important features titled “Search and Replace” and “The Split Operation”.

By: Chrysanthus Date Published: 26 Jul 2012

Introduction

This is the seventh part of my series, ECMAScript String Regular Expressions. We have seen some uses of regex in ECMAScript. We know how to verify if a regex is found in a subject string. We know how to find the position of matched regex in the subject string. Note that the subject string can be a whole page of text. In this part of the series, we shall learn two important features titled, “Obtaining the Match”, “Search and Replace” and “The Split Operation”.

Obtaining the Match
Consider the simple regex, /.ir../ and the subject, “boys and girls in a family”. The regex would match, “girls” in the subject. The question is, how do you return and use “girls” further down in the code? You have to use the string match method of the string object. The syntax is:

    matchObj = subject.match(regex);
    matchStr = matchObj.toString();

There are two statements here. The match method returns the matched (found) item as an object in the first statement. In the second statement, the object is converted to string. Read and try the following code that illustrates this.

        <script type="text/ECMAScript">
                subject = "boys and girls in a family";
                re = /.ir../;
                objFound = subject.match(re);
                strFound = objFound.toString();
                alert(strFound);
        </script>

Note: The match method returns the item found (matched) as an object, or null if nothing is found.

Search and Replace
You can search for a match in the subject string and have the sub strings matched (found) replaced. Consider the following subject string:

             "I am a man. You are a man."

The sub string “man” occurs in this subject in two places. You can have the occurrence of the sub string “man” replaced by woman. You do this using the string object replace() method. The following code illustrates this:

        <script type="text/ECMAScript">
         var subject = "I am a man. You are a man.";

         var str = subject.replace(/man/, "woman");

         alert(subject);
         alert(str);
        </script>

The output is:

             "I am a man. You are a man."
             "I am a woman. You are a man."

There are four lines in the code. The first line is the declaration and assignment of the subject string. The second line does the replacement, using the string object method, replace(). The first argument of the replace() method is the regex; the second argument is the sub string for replacement. The subject string is the object for the replace() method.

The first alert statement displays the subject. The second alert statement displays the string returned by the replace() method.

From the output, we see that the subject remains unchanged. The return string above is the subject, where the first occurrence of the sub string, “man” has been replaced to woman.

For replacement in ECMAScript regex, know this:
- The subject is not changed.
- Use the replace() method of the string object.
- The first argument of the method is the regex.
- The second argument for the method is the sub string for - replacement.
- The object of the method is the subject.
- Replacement takes place in the return string.
- Without the regex g flag only the first occurrence matched is replaced

In the following code the two occurrences of the sub string, “man” are replaced, by “woman”, thanks to the regex g flag.

        <script type="text/ECMAScript">
            var subject = "I am a man. You are a man.";

            var str = subject.replace(/man/g, "woman");

            alert(subject);
            alert(str);
        </script>

The output is:

             "I am a man. You are a man."
             "I am a woman. You are a woman."

The Split Operation
The string object has a method called the split() method. This method splits the string (subject) into an array of sub strings. This is the syntax:

var arr = subject.split([separator][,limit])

The subject is the string to be spit. It is not changed after the split. The separator is a regex. The array contains the sub string separated. The limit is an integer. Some strings (subjects) may have characters at their end that you do not need. If you know the number of sub strings in the subject that you want you can type this number as the limit. Any sub string after this limit will not go into the array. Both the limit and the separator are optional. In our example, we shall not use the limit.

Consider the following subject string:

var subject = "one two three";

If we know the regex (pattern) to identify space between words, then we can split this string into an array made up of the words, “one”, “two” and “three”.   is the character class for space. + will match a space, one or more times. The regex to separate the above words is

               \ +

We assume that a space might be created by hitting the spacebar more than once. The following code illustrates the use of the split function with the above pattern.

        <script type="text/ECMAScript">
            var subject = "one two three";

            var arr = subject.split(/ +/);

            alert(arr[0]);
            alert(arr[1]);
            alert(arr[2]);
            alert(subject);
        </script>

In the subject string the words are separated by spaces. The output of the above code is:

one
two
three

one two three

The spilt function has split the words in the subject string using the space between the words, and put each word as an element in the returned array. The last line in the output is not part of the array. In the code, the last alert statement displays the subject. This was done to show you that the subject remains unchanged after splitting. The word, “split” is not really proper in this section, since the subject string remains unchanged; however, that is the vocabulary the ECMAScript specification uses.

It is possible to have words in a string separated by a comma and a space, like

var subject = "one, two, three";

The regex to separate these words is:

          /, +/

The following code illustrates this:

        <script type="text/ECMAScript">
           var subject = "one, two, three";

           var arr = subject.split(/, +/);

           alert(arr[0]);
           alert(arr[1]);
           alert(arr[2]);
           alert(subject);
        </script>

The output of the above code is:

one
two
three

one, two, three

So, let us take a break here and continue in the next and last part of the series.

Chrys

Broad Network

Using ECMAScript String Regular Expressions

ECMAScript String Regular Expressions – Part 7

Introduction

Related Links

Comments