Wednesday, August 20, 2008

[.js] Regular expresions

regular expressions are commonly used to automate tasks that involves strings treatments. they work the same in every language and the syntax is very similar.

in the next example I'll explain how to use basic regexp syntax to implement the trim() function on javascript. if you're interested on learning more about regular expression I suggest to search on google, it's a very common topic, so you'll find plenty information. to get full reference of regexp on javascript I recommend w3Schools

to implement the trim() function we'll use the next modifiers:
^ -> this search character at the beginning of the string.
$ -> this search character at the end of the string.
| -> to select multiple cases (in regexps this works like an OR)
+ -> search for 1 or more matches but not 0.
/ -> end and beginning of a regexp.
g -> Global search. Search all occurrences of the regular expression in a string

there are two ways of creating a regexp on javascript:
1.- creating a regExp object instance: myExpression = new regExp("regexp","patternFlag")
where regexp is our expression and patter flag is a pattern modifier. (se w3schools for full reference).

2.- usign slashes: /myregexp/.
for setting pattern flags just use this syntax> /myregexp/patternflag
e.g. /\s/g

so lets go to the trim example:
we'll use the String replace method to replace a white space with a '' null character.

first we add new method to String.prototype so we can work on it as a native method of String.

String.prototype.trim = function(){

}

then, we start our replace method, as first parameter, leave it in blank, and as second parameter put simply '' and we set it as a return value:

String.prototype.trim = function(){
return this.replace("yet_to_be_defined",'');
}

the first parameter is our regular expression and the second one, the character we want to put instead of the character to be replaced.

to find a white space we use \s, to find white space at the beginning of the string, we use ^\s, to find all characters at the beginning of the string we use ^\s+.
same for the ending characters, but changing the position match character to $ :
\s+$

to check either beginning and ending white spaces, we use | (or) to select between options and the g pattern flag.

/^\s+|\s+$/g


if we don't use the g pattern flag, replace() would only make the match once, and, since we are specifying /^\s+ or \s+$ but not both, it will only trim or the beginning or ending white spaces (by default it selects the first option).

so we use g to specify a global search and find both matches.

so our final code looks like this:

String.prototype.trim = function(){
return this.replace(/^\s+|\s+$/g, '');
}

No comments: