1. ECA 225 Applied Interactive Programming1 ECA 225 Applied Online Programming regular expressions

2. ECA 225 Applied Interactive Programming2 Regular Expressions  another way to validate form input  less code than String methods  pattern matching  based on Perl’s Regular Expressions  find complex patterns within strings with just a few lines of code

3. ECA 225 Applied Interactive Programming3 Regular Expressions  unique syntax  looks complex and mysterious  broken down into component parts, regular expressions are not so mysterious  In short, you create a pattern to look for /^\b\d{3}\-\d{2}\-\d{4}\b$/

4. ECA 225 Applied Interactive Programming4 Regular Expressions  2 ways to create a regular expression  object constructor, RegExp( )  use new keyword  pass the pattern as an argument  assign result to variable var name = new RegExp( “Bob” );

5. ECA 225 Applied Interactive Programming5 Regular Expressions  2 ways to create a regular expression  assign pattern directly to a variable  delimit with forward slash rather than quotes, as you would a string  in this example, we have created a regular expression to match a string literal, “Bob” var name = /Bob/;

6. ECA 225 Applied Interactive Programming6 Regular Expressions  String methods, such as indexOf( ), are good for searching for exact matches  regular expressions allow us to match patterns, such as a social security number  we can do this with String methods such as indexOf( ) and charAt( ), but it is simpler with a regular expression xxx-xx-xxxx

7. ECA 225 Applied Interactive Programming7 Regular Expressions  regular expressions allow you to search for the correct pattern  define a pattern using  string literals  metacharacters  a character in an expression that is not matchable itself, but acts as a guideline for what is to be matched

8. ECA 225 Applied Interactive Programming8 Regular Expression example  Given the string  search the string to replace each instance of “all” with “the entire”  create a regular expression var myString = “Halle barked all night.”; var myRE = /all/;

9. ECA 225 Applied Interactive Programming9 Regular Expression example cont …  all regular expressions begin and end with a forward slash  use a RegExp or String method var myString = “Halle barked all night.”; var myRE = /all/; newString = myString.replace( myRE, “the entire”); document.write( myString + “ ” + newString );

10. ECA 225 Applied Interactive Programming10 String.replace( )  takes 2 arguments  regular expression which takes the pattern to be matched  the string replacement when a match is found

11. ECA 225 Applied Interactive Programming11 Regular Expression example cont …  only one instance of the match was changed  as written the RE will match only the first instance of the pattern in the target string  to replace all instances of a match we add a switch to the RE  g mean global, all instances of the match  g goes after the last forward slash var myRE = /all/g;

12. ECA 225 Applied Interactive Programming12 Regular Expression example cont …  another problem: we do not want the word “all” to be replaced unless it is a complete word  metacharacter \b  word boundry  the pattern will match only if it is at a word boundary, ie, the beginning or end of a word var myRE = /\ball\b/g;

13. ECA 225 Applied Interactive Programming13 Regular Expression example cont … Parts of this regular expression example / delimited by forward slashes / \b \b/only if the entire word is matched / \ball\b/the literal string “all” is inserted / \ball\b/gglobal

14. ECA 225 Applied Interactive Programming14 Regular Expression test  all regular expressions begin and end with a forward slash  use a RegExp or String method var myString = “Halle barked all night.”; var myRE = /all/; newString = myString.replace( myRE, “REPLACE”); document.write( myString + “ ” + newString );

15. ECA 225 Applied Interactive Programming15 metacharacters g global, find all instances of the match i search without case sensitivity var myRE = /all/ g; var myRE = /all/ i;

16. ECA 225 Applied Interactive Programming16 metacharacters cont … ^ beginning of a string $ end of a string var myRE = /^hal/ i; var myRE = /ong.$/ i;

17. ECA 225 Applied Interactive Programming17 metacharacters cont … \b word boundary \B non-word boundary var myRE = /\ball/ i; var myRE = /\Ball/ i;

18. ECA 225 Applied Interactive Programming18 metacharacters cont … \xnn ASCII character defined by nn [abcde] any one of the enclosed characters var myRE = /\x61/g; var myRE = /[H r]all/g;

19. ECA 225 Applied Interactive Programming19 metacharacters cont … [a-e] any character within the enclosed range [^abcde] any one of the characters not enclosed var myRE = /[a-j]/g; var myRE = /[^H r]all/g;

20. ECA 225 Applied Interactive Programming20 metacharacters cont …. any character except a newline \W any non-alphanumeric character var myRE = /.all./g; var myRE = /\W/g;

21. ECA 225 Applied Interactive Programming21 metacharacters cont … \w any alphanumeric character including underscore [A-Za-z0-9_ ] any alphanumeric character including underscore var myRE = /\w/g; var myRE = /[A-Za-z0-9_ ]/g;

22. ECA 225 Applied Interactive Programming22 metacharacters cont … \d any single digit \D any single non-digit var myRE = /\d/g; var myRE = /\D/g;

23. ECA 225 Applied Interactive Programming23 metacharacters cont … \s any single space \S any single non-space var myRE = /\s/g; var myRE = /\S/g;

24. ECA 225 Applied Interactive Programming24 metacharacters cont … {x } exactly x occurrences of the previous character {x,} x or more occurrences of the previous character var myRE = /l{2}/g; var myRE = /l{1,}/g;

25. ECA 225 Applied Interactive Programming25 metacharacters cont … {x,y } between x and y occurrences of the previous character ? 0 or 1 time var myRE = /l{1,2}/g; var myRE = /H?all/g;

26. ECA 225 Applied Interactive Programming26 metacharacters cont … * zero or more times + 1 or more times var myRE = /al*/g; var myRE = /l+[eo]/g;

27. ECA 225 Applied Interactive Programming27 metacharacters cont … | logical or ( ) grouping var myRE = /a(r|l)/g; var myRE = /a(r|l)\1/g;

28. ECA 225 Applied Interactive Programming28 escaped characters characters which need escaped \ nnewline\ |pipe \ /forward slash\ (L parenthesis \ backlash\ )R parenthesis \.period\ [L bracket \ *asterisk\ ]R bracket \ +plus sign\ {L brace \ ?question mark\ }R brace

29. ECA 225 Applied Interactive Programming29 re.test( )  regular expression to test for SSN  test( ) will return T or F var mySSN = document.myForm.ssn.value; var myRE = /^\b\d{3}\-\d{2}\-\d{4}\b$/ ; result = myRE.test( mySSN ); alert( result );

30. ECA 225 Applied Interactive Programming30 JavaScript methods String methodsReg Exp methods String.replace( )RegExp.test( ) String.search( )RegExp.exec( ) String.match( )

31. ECA 225 Applied Interactive Programming31 String.replace( )  takes 2 arguments  regular expression  replacement string to be used if a match is found var myString = “Halle barked all night.”; var myRE = /\ball\b/g; newString = myString.replace( myRE, “the entire”); document.write( myString + “ ” + newString );

32. ECA 225 Applied Interactive Programming32 String.search( )  takes 1 argument  regular expression which contains the pattern to be matched  if a match is found  character offset is returned  if no match is found  – 1 is returned

33. ECA 225 Applied Interactive Programming33 String.search( ) cont …  example var myStr = "123-45-6789"; var re = /\-\d{2}\-/; var x = myStr.search( re ); document.write( myStr ); alert( x );

34. ECA 225 Applied Interactive Programming34 String.match( )  takes 1 argument  regular expression which contains the pattern to be matched  String.match( ) returns an array  elements of the array are all the values that match the pattern established by the Reg Exp  if no match is found, NULL is returned

35. ECA 225 Applied Interactive Programming35 String.match( ) cont …  example var myStr = "123-45-6789"; var re = /\-\d{2}\-/; var x = myStr.match( re ); document.write( myStr ); alert( x[ 0 ] ); alert( x[ 1 ] );

36. ECA 225 Applied Interactive Programming36 RegExp.test( )  takes 1 argument  the string to be tested  searches the string for a match to the Reg Exp  returns a Boolean value  TRUE or FALSE  used inside an if statement

37. ECA 225 Applied Interactive Programming37 RegExp.test( ) cont …  example var myStr = "123-45-6789"; var re = /^\b(\d{3})\-(\d{2})\-(\d{4})\b$/; var x = re.test( myStr ); if( x ) { alert( x ); }

38. ECA 225 Applied Interactive Programming38 RegExp.exec( )  takes 1 argument  the string to be tested  returns an array of matches found in the string  the value at index 0 is the original string  other indexes contain any values that were matched within parentheses

39. ECA 225 Applied Interactive Programming39 RegExp.exec( ) cont …  example var myStr = "123-45-6789"; var re = /^\b(\d{3})\-(\d{2})\-(\d{4})\b$/; var x = re.exec( myStr ); for( i = 0; i ” + x[ i ] ); }

40. ECA 225 Applied Interactive Programming40 backreference  parentheses have special meaning  grouping  setting precedence  backreferencing  stores the values matched inside parentheses for later use  use special characters to access stored values  $1 through $9

41. ECA 225 Applied Interactive Programming41 backreference cont …  example var myStr = "123-45-6789"; var re = /^\b(\d{3})\-(\d{2})\-(\d{4})\b$/; document.write( myStr.replace( re,"The third match: $3 The second match: $2 The first match: $1" ) );