Regular expressions in JavaScript use detailed _javascript tips

Source: Internet
Author: User
Tags instance method lowercase

[1] definition : Regular, also called a rule or pattern, is a powerful string-matching tool that is an object in JavaScript

[2] features :

[2.1] Greed, matching the longest
[2.2] lazy, do not set/g, then only match the 1th

[3] Two types of wording:

[3.1]perl (use literal form): var expression =/pattern/flags;
e.g. var pattern =/a/i;//Matches all instances of ' a ' in a string
[3.1.1] Three flags Flags
[A]G: Representing global mode
[B]i: Indicates case-insensitive (ignoreCase)
[C]m: Multiple-line mode (multiline)
[3.2]js notation (using RegExp constructor): Two parameters: String pattern to match, flag string (optional)
e.g var pattern = new RegExp (' [Bc]at ', ' I ');
Attention The two parameters of the RegExp constructor are strings
[3.3] The difference between a constructor and a literal
[note] Any expression that can be defined with a literal form can be defined by using a constructor
[3.3.1] literal writing does not support variables and can only be written in the form of a constructor
[Tips] Get the class element (because classname is a variable and can only be in the form of a constructor)

function Getbyclass (obj,classname) {
  var elements = obj.getelementsbytagname (' * ');
  var result = [];
  var pattern = new RegExp (' ^|\\s ' + classname + ' \\s|$ ');
  for (var i = 0; i < elements.length i++) {
    if (pattern.test (Elements[i].classname)) {
      Result.push (elements[i) );
    }
  }
}

[3.3.2] in ECMASCRIPT3, regular expression literals always share the same regexp instance, and each new RegExp instance created using the constructor is a new instance

var re = null, I;
for (i = 0; i < i++) {
  re =/cat/g;
  Re.test (' catastrophe ');
}
for (i = 0; i < i++) {
  re = new RegExp (' Cat ', ' g ');
  Re.test (' catastrophe ');
}  

[3.3.3] ECMAScript5, a new RegExp instance must be created each time using regular expression literals as if the RegExp constructor were called directly

[4] Syntax

[Important] No extra space in the regular expression
[4.0] Metacharacters (14): () [] {} \ ^ $ |? * + .
[note] The meta character must be escaped, that is, with the \ Plus escape character, the regular with the new regexp must be double escaped
[4.1] Escape character
[4.1.0]. Represents any character other than the newline character \ n
[4.1.1]\d Digital \d Non-digital
[4.1.2]\w letters, numbers, underscores \w not letters, numbers, underscores
[note] Chinese characters do not belong to \w
[4.1.3]\s space \s not spaces
[4.1.4]\b boundary character, \w left or right is not \w, a border character \b non-boundary character will appear
[4.1.5]\1 represents the same character as the preceding one
[Tips] Find the most characters and number of duplicates

var str = ' Aaaaabbbbbdddddaaaaaaaffffffffffffffffffgggggcccccce ';
var pattern =/(\w) \1+/g;
var maxLength = 0;
var maxValue = ';
var result = Str.replace (Pattern,function (match,match1,pos,originaltext) {
  if (Match.length > MaxLength) {
    MaxLength = match.length;
    MaxValue = Match1
  }
})
Console.log (maxlength,maxvalue);//18 "F"

[4.1.6] (\w) (\d) \1\2: \1 representative \w The value represented at that time, \2 representative \d the value represented at that time
[note] The children in the regular expression must be enclosed in parentheses, and the order is in the order in which the parentheses appear
[4.1.7]\t tab
[4.1.8]\v Vertical tab
[4.1.9]\uxxxx to find Unicode characters specified in hexadecimal xxxx
[Note 1] [\U4E00-\U9FA5] stands for Chinese
[Note that the characters in 2]alert () and Console.log () are system escape characters
[A]\r return
[B]\n NewLine Line wrapping
[C]\t Table Tab
[d]\b BACKSPACE backspace
[Tips]alert can not be used in <br> or <br\> Alert inside is equivalent to a system parsing, not a browser
E.g.alert (' http://www.baidu.com\n\t hello ')
[Note 3] because the parameters of the RegExp constructor are strings, in some cases the characters need to be double escaped. All metacharacters must be double escaped, and the characters that have been escaped must also be double escaped

Literal pattern  ->       equivalent string//
/\[bc\]at/   "\\[bc\\]at"
///\.at/  "\\.at"//
/name\ /age/  "name\\/age"
///\d.\d{1,2}/  "\\d.\\d{1,2}"
///\w\\hello\\123/      "\\w\\" \\hello\\\\123 "        

[4.2] quantifiers
[4.2.1]{n}: Matching n times
[4.2.2]{n,m}: matching at least n times, up to M times
[4.2.3]{n,}: matching at least n times
[4.2.4]?: Equivalent to {0,1}
[4.2.5]*: equals {0,}
[4.2.6]+: Equivalent to {1,}
[4.3] position symbol
[4.3.1]^ start symbol
[4.3.2] ending symbol is dollar sign
[ 4.3.3]?= must be looking around
[4.3.4]?! Negative forward-looking  
[4.4] control symbols ([]: candidate |: or ^: non-: To)
[4.4.1] (red|blue|green)   Find any specified options  
[4.4.2][abc]& nbsp; find any character between square brackets
[4.4.3][^abc]  find any characters that are not between brackets
[4.4.4][0-9]  find any number from 0 to 9
[4.4.5][a-z]&nbs p; Find any characters from small to lowercase z
[4.4.6][a-z]  find any characters from uppercase A to uppercase Z
[4.4.7][a-z]  find any characters from uppercase A to lowercase z
[4.4.8][adgk ]  find any character within a given set
[4.4.9][^adgk]  find any character outside a given set
[4.5] dollar sign

$$ $
//$& substring matching the entire pattern (same as Regexp.lastmatch value)
//$ '  substring (same as Regexp.leftcontext value) before matching substring
/$ ' substring  after matching substring (same as Regexp.rightcontext value)
//$n matches the nth capturing group substring where n equals 0-9. Represents a substring matching the first capturing group (starting from 1th)
//$NN a substring that matches the nn capturing group, where nn equals 01-99

Console.log (' Cat,bat,sat,fat '. Replace (/(. a) (t)/g, ' $ ')//$0,$0,$0,$0  
console.log (' Cat,bat,sat,fat '). Replace (/(. a) (t)/g, ' $ ')//ca,ba,sa,fa
console.log (' Cat,bat,sat,fat '. Replace (/(. a) (t)/g, ' $ ')//t,t,t,t
console.log (' Cat,bat,sat,fat '. Replace (/(. a) (t)/g, ' $ ')//$3,$3,$3,$3  
console.log (' Cat,bat,sat,fat '). Replace (/(. a) (t)/g, ' $$ ')//$,$,$,$
console.log (' Cat,bat,sat,fat '. Replace (/(. a) (t)/g, ' $& '))//cat,bat, Sat,fat
console.log (' Cat,bat,sat,fat '. Replace (/(. a) (t)/g, ' $ ')//,cat,,cat,bat,,cat,bat,sat,
Console.log (' Cat,bat,sat,fat '. Replace (/(. a) (t)/g, "$")//,bat,sat,fat,,sat,fat,,fat,

[5] Instance Properties : You can learn about the various aspects of a regular expression through an instance property, but it's not much use because it's all contained in a schema declaration
[5.1]global: Boolean value that indicates whether the G flag is set
[5.2]ignorecase: Boolean value that indicates whether I flag is set
[5.3]lastindex: integer representing the character position at which to begin searching for the next occurrence, starting from 0
[5.4]multiline: Boolean value that indicates whether the flag m is set
[5.5]source: string representation of the regular expression, returned in literal form rather than in string pattern in the incoming constructor

var pattern = new RegExp (' \\[bc\\]at ', ' I ');
Console.log (Pattern.global);//false
Console.log (pattern.ignorecase);//true  
Console.log ( Pattern.multiline);//false
Console.log (pattern.lastindex);//0
Console.log (Pattern.source);//' \[bc\]at '

[6] Constructor Property (static property): applies to all regular expressions in the scope and changes based on the most recent regular expression operation performed. The uniqueness of these attributes is that they can be accessed in two ways, long property names and short property names. Short attribute names are mostly not valid ECMAScript identifiers, so they must be accessed through the square brackets syntax
[6.1] Using these properties, you can extract more specific information from the actions performed by the Exec () method or the text () method


Long property name Short attribute name Description
Input $_ the last string to match
Lastmatch $& last match
Lastparen $+ last matched capture group
Text before lastmatch in the leftcontext $ ' input string
Multiline $* Boolean value that indicates whether all expressions use multiline mode
Text after Lastmarch in the rightcontext $ ' input string

[Note 1]opera does not support short property names
[Note 2]opera does not support Input\lastmatch\lastparen\multiline
[Note 3] IE does not support multiline

var text = ' This has been a short summer ';
var pattern =/(.) hort/g;
if (pattern.test (text)) {
  console.log (regexp.input);//' This has been a short summer '
  console.log ( Regexp.leftcontext);/' This has been a '
  console.log (regexp.rightcontext);//' Summer '
  console.log ( Regexp.lastmatch);//' Short '
  console.log (Regexp.lastparen);//' s '
  console.log (regexp.multiline);//false
  console.log (regexp[' $_ ']);/' This has been a short summer '
  console.log (regexp[' $ ']);/' This has been a '
  Console.log (regexp["$"]);//' Summer '
  console.log (regexp[' $& ']);//' Short '
  console.log ( regexp[' $+ ']);//' s '
  console.log (regexp[' $* ');//false  
}

[6.2] There are up to 9 constructor properties for storing capturing groups

Regexp.$1\regexp.$2\regexp.$3 ... To regexp.$9 to store first, second ... The Nineth matching capturing group. These properties are automatically populated when the exec () or test () method is invoked

var text = ' This has been a short summer ';
var pattern =/(..) or (.) /g;
  if (pattern.test (text)) {
    console.log (regexp.$1);//sh
    Console.log (regexp.$2);//t
}

[7] Instance method:
[7.1]exec (): Designed specifically for capturing groups, accepts a parameter, the string to which the pattern is applied. The array that contains the first occurrence information is then returned. Returns null without a match. The returned array contains two additional attributes: Index and input. Index indicates the position of the match at the string, and input represents the string that applies the regular expression. In the array, the first item is a string that matches the entire pattern, and the other item is a string that matches the capturing group in the pattern, and if there is no capturing group in the pattern, the array contains only one item

var text = ' Mom and Dad and baby and others ';
var pattern =/mom (and dad (and baby)?)? /gi;
var matches = pattern.exec (text);
Console.log (pattern,matches);
Pattern.lastindex:20
//matches[0]: ' Mom and Dad and Baby '
//matches[1: ' and dad and Baby '
//matches[2 ]: ' and baby '
//matches.index:0
//matches.input: ' Mom and Dad and baby and others '  

[Note 1] for the EXEC () method, it returns only one match at a time, even if the global flag (g) is set in the pattern
[Note 2] If you call EXEC () multiple times on the same string without setting a global flag, the information for the first occurrence is always returned
[Note 3] in the case of setting the global flag, each call to EXEC () will continue to find new matches in the string
[Note 4] The ie8-JS implementation has a bias on the Lastindex property, and the Lastindex property changes every time, even in a non-global mode.

var text = ' Cat,bat,sat,fat ';
var pattern1 =/.at/;
var matches = pattern1.exec (text);
Console.log (pattern1,matches);
pattern1.lastindex:0
//matches[0]: ' Cat '
//matches.index:0
//matches.input: ' Cat,bat,sat,fat '

matches = pattern1.exec (text);  
Console.log (pattern1,matches);  
pattern1.lastindex:0
//matches[0]: ' Cat '
//matches.index:0
//matches.input: ' Cat,bat,sat,fat '

var text = ' Cat,bat,sat,fat ';
var pattern2 =/.at/g;
var matches = pattern2.exec (text);
Console.log (pattern2,matches);  
Pattern2.lastindex:3
//matches[0]: ' Cat '
//matches.index:0
//matches.input: ' Cat,bat,sat,fat '

matches = pattern2.exec (text);
Console.log (pattern2,matches);  
Pattern2.lastindex:7
//matches[0]: ' Bat '
//matches.index:4
//matches.input: ' Cat,bat,sat,fat '  

[Tips] Use the Exec () method to find all locations and all values that match

var string = ' j1h342jg24g234j 3g24j1 ';
var pattern =/\d/g;
var ValueArray = [];//value
var indexarray = [];//position
var temp = pattern.exec (string);
while (temp!= null) {
  Valuearray.push (temp[0]);
  Indexarray.push (temp.index);
  temp = pattern.exec (string);
Console.log (Valuearray,indexarray);

[7.2]test (): Accepts a string argument that returns true if the pattern matches the argument, or False
[note] often used in an if statement only to know if the target string matches a pattern, but does not need to know its textual content

var text = ' 000-00-000 ';
var pattern =/\d{3}-\d{2}-\d{4}/;
if (pattern.test (text)) {
  Console.log (' The pattern is matched ');
}

[8] Pattern matching method
[8.1]match (): Accepts only one argument, regular or string, saves the matching content to an array and returns
[note] When the global tag is added, the match () method returns no index and input properties in the value
[A] do not add/g

var string = ' Cat,bat,sat,fat ';
var pattern =/.at/;
var matches = String.match (pattern);
Console.log (matches,matches.index,matches.input);//[' cat '] 0 ' cat,bat,sat,fat ' 

[b] plus/g

var string = ' Cat,bat,sat,fat ';
var pattern =/.at/g;
var matches = String.match (pattern);
Console.log (matches,matches.index,matches.input);//[' cat ', ' bat ', ' sat ', ' fat '] undefined undefined

[C] String

var string = ' Cat,bat,sat,fat ';
var pattern = ' at ';
var matches = String.match (pattern);
Console.log (matches,matches.index,matches.input);//[' at '] 1 ' cat,bat,sat,fat '  

[8.2]search (): Accepts only one argument, regular, or string that returns the first occurrence of the matching content in the string, similar to indexof that cannot set the starting position, cannot find return-1
[A] regular (plus/g and no/g effect)

var string = ' Cat,bat,sat,fat ';
var pattern =/.at/;
var pos = String.search (pattern);
Console.log (POS);//0

[b] String

var string = ' Cat,bat,sat,fat ';
var pattern = ' at ';
var pos = String.search (pattern);
Console.log (POS);//1

[Tips] Find all the places that match

function Fnallsearch (str,pattern) {
  var pos = str.search (pattern); 
  var length = Str.match (pattern) [0].length;
  var index = pos+length;
  var result = [];
  var last = index;
  Result.push (POS);
  while (true) {
    str = STR.SUBSTR (index);  
    pos = Str.search (pattern);
    if (pos = = 1) {break
      ;
  }
  Length = Str.match (pattern) [0].length;
  index = pos+length;
  Result.push (Last+pos);
  Last + = index;  
}
return result;
}  
Console.log (Fnallsearch (' Cat23fbat246565sa3dftf44at ',/\d+/));//[3,9,17,22]

[8.3]replace (): Receives two parameters: the first parameter is a regular expression or a string (what is to be found), the second argument is a string or a function (the substituted content)
[A] string substitution

var string = ' Cat,bat,sat,fat ';
var result = String.Replace (' at ', ' ond ');
Console.log (result);//' Cond,bat,sat,fat '

[b] no/g replacement

var string = ' Cat,bat,sat,fat ';
var result = String.Replace (/at/, ' ond ');
Console.log (result);//' Cond,bat,sat,fat '

[C] There are/g replacements

var string = ' Cat,bat,sat,fat ';
var result = String.Replace (/at/g, ' ond ');
Console.log (result);//' Cond,bond,sond,fond '

[d] Function substitution: In the case of only one match (that is, a string that matches the pattern, the function is passed 3 parameters: the match of the pattern, the position of the pattern match in the string, the original string.) In cases where a regular expression defines more than one capturing group, the arguments passed to the function are, in turn, matches of the pattern, a match for the first capturing group, and a match for the second capturing group ... A match for the nth capturing group, but the last two parameters are still the position of the pattern's match in the string and the original string, which returns a string.

[Tips] Prevent cross-site scripting attacks XSS (CSS)

function Htmlescape (text) {return
  text.replace (/[<>) &]/g,function (match,pos,originaltext) {
    Switch (match) {case
      ' < ': return
        ' < ';
      Case ' > ': Return
        ' > ';
      Case ' & ': Return
        ' & ';
      Case ' \ ': Return
        ' ' ';}} '
  ;
}
Console.log (Htmlescape (' <p class=\ "greeting\" >hello world!</p> '));
<p class= "Greeting" >hello world!</p> console.log (htmlescape <p "class=" greeting
World!</p> '));
Ditto  

[9] Inherited methods: Both return regular expression literals, regardless of how the regular expression was created. Note that the string representation of the regular expression returned by ToString () and toLocaleString (), and valueof returns the regular expression object itself
[9.1]tostring ()
[9.2]tolocalestring ()
[9.3]valueof ()

var pattern = new RegExp (' \\[bc\\]at ', ' gi ');
Console.log (Pattern.tostring ()); '/\[bc\]at/gi '
console.log (pattern.tolocalestring ());//'/\[bc\]at/gi '
console.log (pattern.valueof ()) ; /\[bc\]at/gi

[10] Limitations: The following are attributes not supported by the ECMAScript regular expression
[10.1] \a and \z anchors that match the end of the string beginning (but with the ^ and $ to match the beginning end of the string)
[10.2] Find backward (but support forward lookup)
[10.3] Parallel set and intersection class
[10.4] Atomic Group
[10.5] Unicode support (except for single characters)
[10.6] named capturing group (but support for numbered capturing groups)
[10.7]s (single line) and X (free-spacing no interval) match pattern
[10.8] Condition matching
[10.9] Regular expression comments

[11] Common examples
[11.1] Two ways to find all the numbers in a string
[11.1.1] operates with a traditional string

var str1 = ' j1h342jg24g234j 3g24j1 ';
var array = [];
var temp = ';
for (var i = 0; i < str1.length; i++) {
  var value = parseint (Str1.charat (i));//If you use number, you cannot exclude the space if
    (!isnan value ) {
      Temp + = Str1.charat (i);
    } else{
      if (temp!= ') {
        array.push (temp);
        temp = ';  
      }
}} if (temp!= ') {
  array.push (temp);
  temp = ';  
}
Console.log (array);

[11.1.2] completes with a regular expression

var str1 = ' j1h342jg24g234j 3g24j1 ';
Array = Str1.match (/\d+/g);
Console.log (array);

[11.2] Sensitive word filtering (application of replace callback function)

var string = ' Flg is a cult ';
var pattern =/flg| cult/g;
var result = String.Replace (Pattern,function ($) {
  var s = ';
  for (var i = 0; i < $0.length i++) {
    s+= ' * ';
  }
  return s;
})
Console.log (result);

[11.3] Date formatting

var array = [' 2015.7.28 ', ' 2015-7-28 ', ' 2015/7/28 ', ' 2015.7-28 ', ' 2015-7.28 ', ' 2015/7---'];
function FormatDate (date) {return
  date.replace (/(\d+) \d+ (\d+) \d+ (\d+)/, ' $ ' + ' year ' + ' $ ' + ' month ' + ' $ ' + ' Day ')
}
var result = [];
for (var i = 0; i < Array.Length i++) {
  Result.push (formatdate (array[i));
}
Console.log (result);

[11.4] Get the text content in the Web page

var str = ' <p>refds</p><p>fasdf</p> '
var pattern =/<[^<>]+>/g;
Console.log (str.replace (Pattern, '));

[11.5] trim () compatible writing for removing the end and end spaces

var string = ' My name is Littlematch ';
Console.log (String.Replace (/^\s+|\s+$/, ")");

I hope that the above description of the regular expression of JavaScript can be helpful to everyone.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.