JS基本篇--正则表达式详解

正则表达式异常有效,查找、婚配、处置惩罚字符串、替代和转换字符串,输入输出等。下面整顿一些经常运用的正则表达式。

经常运用的正则字符

正则字符 形貌

  • \:将下一个字符标记为一个特别字符、或一个原义字符、或一个 向后援用、或一个八进制转义符。比方,’n’ 婚配字符 “n”。’n’ 婚配一个换行符。序列 ‘\’ 婚配 “” 而 “(” 则婚配 “(“。
  • ^:婚配输入字符串的最先位置。假如设置了 RegExp 对象的 Multiline 属性,^ 也婚配 ‘n’ 或 ‘r’ 今后的位置。
  • $:婚配输入字符串的完毕位置。假如设置了RegExp 对象的 Multiline 属性,$ 也婚配 ‘n’ 或 ‘r’ 之前的位置。
  • *:婚配前面的子表达式零次或屡次。比方,zo 能婚配 “z” 以及 “zoo”。 等价于{0,}。
  • +:婚配前面的子表达式一次或屡次。比方,’zo+’ 能婚配 “zo” 以及 “zoo”,但不能婚配 “z”。+ 等价于 {1,}。
  • ?:婚配前面的子表达式零次或一次。比方,”do(es)?” 能够婚配 “do” 或 “does” 中的”do” 。? 等价于 {0,1}。
  • {n}:n 是一个非负整数。婚配肯定的 n 次。比方,’o{2}’ 不能婚配 “Bob” 中的 ‘o’,然则能婚配 “food” 中的两个 o。
  • {n,}:n 是一个非负整数。起码婚配n 次。比方,’o{2,}’ 不能婚配 “Bob” 中的 ‘o’,但能婚配 “foooood” 中的一切 o。’o{1,}’ 等价于 ‘o+’。’o{0,}’ 则等价于 ‘o*’。
  • {n,m}:m 和 n 均为非负整数,个中n <= m。起码婚配 n 次且最多婚配 m 次。比方,”o{1,3}” 将婚配 “fooooood” 中的前三个 o。’o{0,1}’ 等价于 ‘o?’。请注重在逗号和两个数之间不能有空格。
  • ?:当该字符紧跟在任何一个其他限定符 (*, +, ?, {n}, {n,}, {n,m}) 背面时,婚配情势黑白贪欲的。非贪欲情势尽量少的婚配所搜刮的字符串,而默许的贪欲情势则尽量多的婚配所搜刮的字符串。比方,关于字符串 “oooo”,’o+?’ 将婚配单个 “o”,而 ‘o+’ 将婚配一切 ‘o’。
  • ·:婚配除 “n” 以外的任何单个字符。要婚配包括 ‘n’ 在内的任何字符,请运用象 ‘[.n]’ 的情势。
  • (pattern):婚配 pattern 并猎取这一婚配。所猎取的婚配能够从发生的 Matches 鸠合取得,在VBScript 中运用 SubMatches 鸠合,在JScript 中则运用 $0…$9 属性。要婚配圆括号字符,请运用 ‘(‘ 或 ‘)’。
  • (?:pattern):婚配 pattern 但不猎取婚配效果,也就是说这是一个非猎取婚配,不举行存储供今后运用。这在运用 “或” 字符 (|) 来组合一个情势的各个部份是很有效。比方, ‘industr(?:y|ies) 就是一个比 ‘industry|industries’ 更简朴的表达式。
  • (?=pattern):正向预查,在任何婚配 pattern 的字符串最先处婚配查找字符串。这是一个非猎取婚配,也就是说,该婚配不需要猎取供今后运用。比方,’Windows (?=95|98|NT|2000)’ 能婚配 “Windows 2000” 中的 “Windows” ,但不能婚配 “Windows 3.1” 中的 “Windows”。预查不斲丧字符,也就是说,在一个婚配发生后,在末了一次婚配今后马上最先下一次婚配的搜刮,而不是从包括预查的字符今后最先。
  • (?!pattern):负向预查,在任何不婚配 pattern 的字符串最先处婚配查找字符串。这是一个非猎取婚配,也就是说,该婚配不需要猎取供今后运用。比方’Windows (?!95|98|NT|2000)’ 能婚配 “Windows 3.1” 中的 “Windows”,但不能婚配 “Windows 2000” 中的 “Windows”。预查不斲丧字符,也就是说,在一个婚配发生后,在末了一次婚配今后马上最先下一次婚配的搜刮,而不是从包括预查的字符今后最先
  • x|y:婚配 x 或 y。比方,’z|food’ 能婚配 “z” 或 “food”。'(z|f)ood’ 则婚配 “zood” 或 “food”。
  • [xyz]:字符鸠合。婚配所包括的恣意一个字符。比方, ‘[abc]‘ 能够婚配 “plain” 中的 ‘a’。
  • [^xyz]:负值字符鸠合。婚配未包括的恣意字符。比方, ‘[^abc]‘ 能够婚配 “plain” 中的’p’。
  • [a-z]:字符局限。婚配指定局限内的恣意字符。比方,’[a-z]‘ 能够婚配 ‘a’ 到 ‘z’ 局限内的恣意小写字母字符。
  • [^a-z]:负值字符局限。婚配任何不在指定局限内的恣意字符。比方,'[^a-z]' 能够婚配任何不在 ‘a’ 到 ‘z’ 局限内的恣意字符。
  • \b:婚配一个单词边境,也就是指单词和空格间的位置。比方, ‘erb’ 能够婚配”never” 中的 ‘er’,但不能婚配 “verb” 中的 ‘er’。
  • \B:婚配非单词边境。’erB’ 能婚配 “verb” 中的 ‘er’,但不能婚配 “never” 中的 ‘er’。
  • \cx:婚配由 x 指明的控制字符。比方, cM 婚配一个 Control-M 或回车符。x 的值必需为 A-Z 或 a-z 之一。不然,将 c 视为一个原义的 ‘c’ 字符。
  • \d:婚配一个数字字符。等价于 [0-9]。
  • \D:婚配一个非数字字符。等价于 [^0-9]
  • \f:婚配一个换页符。等价于 \x0c\cL
  • \n:婚配一个换行符。等价于 \x0a\cJ
  • \r:婚配一个回车符。等价于 \x0d\cM
  • \s:婚配任何空缺字符,包括空格、制表符、换页符等等。等价于 [ \f\n\r\t\v]
  • \S:婚配任何非空缺字符。等价于 [^ \f\n\r\t\v]
  • \t:婚配一个制表符。等价于 \x09\cI
  • \v:婚配一个垂直制表符。等价于 \x0b\cK
  • \w:婚配包括下划线的任何单词字符。等价于’[A-Za-z0-9_]‘。
  • \W:婚配任何非单词字符。等价于 ‘[^A-Za-z0-9_]‘。
  • \xn:婚配 n,个中 n 为十六进制转义值。十六进制转义值必需为肯定的两个数字长。比方,’\x41‘ 婚配 “A“。’x041′ 则等价于 ‘\x04‘ & “1“。正则表达式中能够运用 ASCII 编码。
  • \num:婚配 num,个中 num 是一个正整数。对所猎取的婚配的援用。比方,’(.)\1‘ 婚配两个一连的雷同字符。
  • \n:标识一个八进制转义值或一个向后援用。假如 n 之前起码 n 个猎取的子表达式,则 n 为向后援用。不然,假如 n 为八进制数字 (0-7),则 n 为一个八进制转义值。
  • \nm:标识一个八进制转义值或一个向后援用。假如 \nm 之前起码有 nm 个取得子表达式,则 nm 为向后援用。假如 \nm 之前起码有 n 个猎取,则 n 为一个后跟笔墨 m 的向后援用。假如前面的前提都不满足,若 n 和 m 均为八进制数字 (0-7),则 \nm 将婚配八进制转义值 nm。
  • \nml:假如 n 为八进制数字 (0-3),且 m 和 l 均为八进制数字 (0-7),则婚配八进制转义值 nml。

RegExp范例

ECMAScript经由过程RegExp范例支撑正则表达式,以下:

var expression = /pattern/flags;

个中的情势(pattern)部份能够是任何简朴或许庞杂的正则表达式,能够包括字符类、限定符、分组、向前查找以及反向援用。每一个正则表达式可带有一个或许多个标注(flags),用以标明正则表达式的行动。有三个一下标志:

  • g:示意全局情势,即情势将被运用到一切字符串,而非在发明第一个婚配项时马上住手。
  • i:示意不辨别大小写情势。
  • m:示意多行情势,即在抵达一行文本末端时还在继承查找下一行中是不是存在于情势婚配的项。

正则表达式定义体式格局

以字面量的情势来定义正则表达式

比方:婚配第一个bat或许cat,不辨别大小写

var pattern = /[bc]at/i;

运用RegExp组织函数

它吸收两个参数:一个是要婚配的字符串情势,另一个是可选的标志字符串。能够运用字面量定义的任何表达式,都能够运用组织函数来定义,照样以上面的例子为例:

var pattern = new RegExp("[bc]at","i");

注重:RegExp组织函数情势参数时字符串,所以再某些状况下要对字符进项两重转义。一切元字符都必需两重转义,如字面量情势为/\[bc\]at/,那末等价的字符串为"/\\[bc\\]at/"

例子:

var re = null,
i;
for(i=0; i < 10; i++){
    re = /cat/g;
    console.log(re.test("catastrophe"));
}
for(i=0; i < 10; i++){
    re = new RegExp("cat","g");
    console.log(re.test("catastrophe"));
}

打印效果都为10个true

正则表达式要领

RegExp对象的exec()要领

该要领是特地为捕捉组而设想的,其接收一个参数,即要运用情势的字符串,然后返回包括第一个婚配项信息的数组;或许在没有婚配项的状况下返回null。返回的数组虽然是Array的实例,然则包括两个分外的属性:indexinput。个中index示意婚配项在字符串中的位置,而input示意运用字符串表达式的字符串。
例:

var text = "mom and dad and baby";
var pattern = /mom( and dad( and baby)?)?/gi;
var matches = pattern.exec(text);
console.log(matches.index); //0
console.log(matches.input); //mom and dad and baby
console.log(matches[0]);    //mom and dad and baby
console.log(matches[1]);    //and dad and baby
console.log(matches[2]);    //and baby

关于exec()要领而言,纵然在情势中设置了全局标志g,它每次也只是返回一个婚配项。在不设置全局标志的状况下,在统一个字符串上屡次挪用exec()要领将一向返回第一个婚配项的信息。而在设置全局标志的状况下,每次挪用exec()则都邑在字符串中继承查找新婚配项,以下例子:

var text = "cat, bat, sat, fat";
var pattern1 = /.at/;

var matches = pattern1.exec(text);
console.log(matches.index); //0
console.log(matches[0]);  //cat
console.log(pattern1.lastIndex); //0

matches = pattern1.exec(text);
console.log(matches.index); //0
console.log(matches[0]);  //cat
console.log(pattern1.lastIndex); //0

var pattern2 = /.at/g;

var matches = pattern2.exec(text);
console.log(matches.index); //0
console.log(matches[0]);  //cat
console.log(pattern2.lastIndex); //3

var matches = pattern2.exec(text);
console.log(matches.index); //5
console.log(matches[0]);  //bat
console.log(pattern2.lastIndex); //8

注重:IEJavaScript完成lastIndex属性上存在误差,纵然在非全局情势下,lastIndex属性每次也都在变化。

test()要领

正则表达式经常运用要领test(),它接收一个字符串参数。在情势与该参数婚配的状况下返回true,不然返回false

用法:正则.test(字符串)

例1:推断是不是是数字

var str = '374829348791';
var re = /\D/;      //  \D代表非数字
if( re.test(str) ){   // 返回true,代表在字符串中找到了非数字。
    alert('不满是数字');
}else{
    alert('满是数字');
}

例2:

var text ="000-00-0000";
var pattern = /\d{3}-\d{2}-\d{4}/;
if(pattern.test(text)){
    console.log('the pattern was matched.');
}

search()要领

在字符串搜刮相符正则的内容,搜刮到就返回涌现的位置(从0最先,假如婚配的不只是一个字母,那只会返回第一个字母的位置), 假如搜刮失利就返回 -1

用法:字符串.search(正则)

例子:在字符串中找字母b,且不辨别大小写

var str = 'abcdef';
var re = /B/i;
//var re = new RegExp('B','i'); 也能够如许写
alert( str.search(re) ); // 1

match要领

猎取正则婚配到的效果,以数组的情势返回

用法: 字符串.match(正则)

比方:

"186a619b28".match(/\d+/g); // ["186","619","28"] 

假如上面的婚配不是全局婚配,那末取得的效果以下:
["186", index: 0, input: "186a619b28"]

replace要领

replace 自身是JavaScript字符串对象的一个要领,它许可吸收两个参数:

replace([RegExp|String],[String|Function])
第1个参数能够是一个一般的字符串或是一个正则表达式.
第2个参数能够是一个一般的字符串或是一个回调函数.

假如第2个参数是回调函数,每婚配到一个效果就回调一次,每次回调都邑通报以下参数:

  • result: 本次婚配到的效果
  • $1,…$9: 正则表达式中有几个(),就会通报几个参数,$1~$9离别代表本次婚配中每一个()提取的效果,最多9个
  • offset:纪录本次婚配的最先位置
  • source:接收婚配的原始字符串

以下是replace和JS正则搭配运用的几个罕见典范案例:

(1)完成字符串的trim函数,去除字符串双方的空格

String.prototype.trim = function(){
 
  //体式格局一:将婚配到的每一个效果都用""替代
  return this.replace(/(^\s+)|(\s+$)/g,function(){
    return "";
  });
 
  //体式格局二:和体式格局一的道理雷同
  return this.replace(/(^\s+)|(\s+$)/g,'');
};

^s+ 示意以空格开首的一连空缺字符,s+$ 示意以空格末端的一连空缺字符,加上() 就是将婚配到的效果提取出来,由因而 | 的关联,因而这个表达式最多会match到两个效果集,然后实行两次替代:

String.prototype.trim = function(){
  /**
   * @param rs:婚配效果
   * @param $1:第1个()提取效果
   * @param $2:第2个()提取效果
   * @param offset:婚配最先位置
   * @param source:原始字符串
   */
  this.replace(/(^\s+)|(\s+$)/g,function(rs,$1,$2,offset,source){
    //arguments中的每一个元素对应一个参数
    console.log(arguments);
  });
};
 
" abcd ".trim();

输出效果:

[" ", " ", undefined, 0, " abcd "] //第1次婚配效果
[" ", undefined, " ", 5, " abcd "] //第2次婚配效果

(2)提取浏览器url中的参数名和参数值,天生一个key/value的对象

function getUrlParamObj(){
  var obj = {};
  //猎取url的参数部份
  var params = window.location.search.substr(1);
  //[^&=]+ 示意不含&或=的一连字符,加上()就是提取对应字符串
  params.replace(/([^&=]+)=([^&=]*)/gi,function(rs,$1,$2){
    obj[$1] = $2;
  });
 
  return obj;
}

/([^&=]+)=([^&=]*)/gi 每次婚配到的都是一个完全key/value,形如 xxxx=xxx, 每当婚配到一个如许的效果时就实行回调,并通报婚配到的keyvalue,对应到$1$2

(3)在字符串指定位置插进去新字符串

String.prototype.insetAt = function(str,offset){
 
  //运用RegExp()组织函数建立正则表达式
  var regx = new RegExp("(.{"+offset+"})");
 
  return this.replace(regx,"$1"+str);
};
 
"abcd".insetAt('xyz',2); //在b和c之间插进去xyz
//效果 "abxyzcd"

offset=2时,正则表达式为:(^.{2}) .示意除\n以外的恣意字符,背面加{2} 就是婚配以数字或字母构成的前两个一连字符,加()就会将婚配到的效果提取出来,然后经由过程replace将婚配到的效果替代为新的字符串,形如:效果=效果+str

(4) 将手机号12988886666转化成129 8888 6666

function telFormat(tel){
 
  tel = String(tel);
 
  //体式格局一
  return tel.replace(/(\d{3})(\d{4})(\d{4})/,function (rs,$1,$2,$3){
    return $1+" "+$2+" "+$3
  });
 
  //体式格局二
  return tel.replace(/(\d{3})(\d{4})(\d{4})/,"$1 $2 $3");
}

(\d{3}\d{4}\d{4}) 能够婚配完全的手机号,并离别提取前3位、4-7位和8-11位,"$1 $2 $3" 是在三个效果集中心加空格构成新的字符串,然后替代完全的手机号。
(5)replace()要领全局替代变量

简朴替代字符:string.replace("a","b"); (把 a 替代成 b)
全局替代字符:string.replace(/a/g,"b");(全局把a替代成b)

然则假如是全局替代一个变量内容,以下,给一个电话号码中心加*号

var phone = "15512345678";
var sliceNumber = phone.slice(3,phone.length - 3);
var newPhone = phone.replace(new RegExp(sliceNumber,'g'),'****');
console.log(newPhone); //155****678

经常运用实例

婚配第一个bat或许cat,不辨别大小写: /[bc]at/i 或许 new RegExp("[bc]at","i");

婚配一切以”at”末端的3个字符组合,不辨别大小写:/.at/gi;

只能输入数字:^[0-9]*$;

只能输入n位的数字:^\d{n}$

只能输入起码n位的数字:^\d{n,}$

只能输入m~n位的数字:^\d{m,n}$

只能输入零和非零开首的数字:^(0|[1-9][0-9]*)$

只能输入有两位小数的正实数:^[0-9]+(.[0-9]{2})?$

只能输入有1~3位小数的正实数:^[0-9]+(.[0-9]{1,3})?$

只能输入非零的正整数:^\+?[1-9][0-9]*$

只能输入长度为3的字符:^.{3}$

只能输入由26个英笔墨母构成的字符串:^[A-Za-z]+$

只能输入由数字和26个英笔墨母构成的字符串:^[A-Za-z0-9]+$

只能输入由数字、26个英笔墨母或许下划线构成的字符串:^\w+$

考证用户暗码:以字母开首,长度在6~18之间,只能包括字符、数字和下划线:^[a-zA-Z]\w{5,17}$

考证是不是含有^%&’,;=?$”等字符:[^%&',;=?$\x22]+

只能输入汉字:^[\u4e00-\u9fa5]{0,}$

考证Email地点:^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$

考证InternetURL:^http://([\w-]+\.)+[\w-]+(/[\w-./?%&=]*)?$

考证身份证号(15位或18位数字):^\d{15}|\d{18}$

考证IP地点:^((2[0-4]\d|25[0-5]|[01]?\d\d?)\.){3}(2[0-4]\d|25[0-5]|[01]?\d\d?)$

婚配两个两个堆叠涌现的字符 比方,”aabbc11asd”, 返回效果为aa bb 11三组match:(\w)\1

婚配成对的HTML标签:<(?<tag>[^\s>]+)[^>]*>.*</\k<tag>>

婚配1-58之间的数字:/^([1-9]|[1-5][0-8])$/

婚配 -90至90之间的整数(包括-90和90):^(-?[1-8][0-9]|-?[1-9]|-?90|0)$
婚配扫尾空缺字符:^\s+|\s+$
中文,全角,半角婚配:

str="中文;;a"    
 alert(str.match(/[\u0000-\u00ff]/g))     //半角  
 alert(str.match(/[\u4e00-\u9fa5]/g))     //中文  
 alert(str.match(/[\uff00-\uffff]/g))     //全角

找反复项最多的字符个数:

var str = 'assssjdssskssalsssdkjsssdss';

var arr = str.split(''); //把字符串转换为数组
str = arr.sort().join(''); //起首举行排序,如许效果会把雷同的字符放在一同,然后再转换为字符串
//alert(str);  // aaddjjkklsssssssssssssssss

 var value = '';
 var index = 0; 
var re = /(\w)\1+/g;  //婚配字符,且反复这个字符,反复次数起码一次。
str.replace(re,function($0,$1){ 
   //alert($0);   代表每次婚配胜利的效果 : aa dd jj kk l sssssssssssssssss
     //alert($1);  代表每次婚配胜利的第一个子项,也就是\w:  a d j k l S 
  
    if(index<$0.length){  //假如index保留的值小于$0的长度就举行下面的操纵
          index = $0.length;  // 如许index一向保留的就在最大的长度
           value = $1;  //value保留的是涌现最多的这个字符
    }

}); 

alert('最多的字符:'+value+',反复的次数:'+index);  // s   17

推断是不是是QQ号:
//^ : 放在正则的最最先位置,就代表肇端的意义,注重 /[^a] //^[a]/是不一样的,前者是消除的意义,后者是代表首位。

//$ : 正则的末了位置 , 就代表完毕的意义

//起首想QQ号的划定规矩 
      1 首位不能是0 
      2 必需是 5-12位的数字
   
    var aInput = document.getElementsByTagName('input');
    var re = /^[1-9]\d{4,11}$/;
    //123456abc为了防备涌现如许的状况,所以必需限定末了
    //首位是0-9,接着是4-11位的数字范例。
aInput[1].onclick = function(){
    if( re.test(aInput[0].value) ){
        alert('是QQ号');
    }else{
        alert('不是QQ号');
    }

};

去掉前后空格(面试题经常涌现):

var str = '  hello  ';
alert( '('+trim(str)+')' );//为了看出区分所以加的括号。 (hello)
function trim(str){
   var re = /^\s+|\s+$/g; // |代表或许   \s代表空格  +起码一个    前面有起码一个空格 或许背面有起码一个空格 且全局婚配
  return str.replace(re,''); //把空格替代成空
}

经常运用的一些表单校验:

婚配中文:[\u4e00-\u9fa5] //中文ACALL码的局限
行首行尾空格:^\s*|\s*$ //首行涌现恣意个空格或许尾行涌现恣意个空格(恣意示意也能够没有空格)

Email:^\w+@[a-z0-9]+(\.[a-z]+){1,3}$  
      //肇端起码为一个字符(\w字母,数字或许下划线),然后婚配@,接着为恣意个字母或许数字,\.代表真正的点,.背面为起码一个的字符(a-z),同时这个(比方.com)团体为一个子项作为完毕,能够涌现1-3次。由于有的邮箱是如许的.cn.net。(xxxx.@qq.com xxxx.@163.com xxxx.@16.cn.net )

网址:[a-zA-z]+://[^\s]*   http://......
  //婚配不分大小写的恣意字母,接着是//,背面黑白空格的恣意字符

邮政编码:[1-9]\d{5}  //肇端数字不能为0,然后是5个数字
身份证:[1-9]\d{14}|[1-9]\d{17}|[1-9]\d{16}x

可参考地点:
通晓 JS正则表达式
通晓正则表达式- 读书笔记
过目成诵JS正则表达式

    原文作者:风雨后见彩虹
    原文地址: https://segmentfault.com/a/1190000000410591
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞