JavaScript--正则表达式

语法

var reg = new RegExp(pattern, modifiers)
或者更简单的方式：
var reg = /pattern/modifiers

pattern(模式)描述了表达式的模式

modifiers(修饰符)用于指定全局匹配、区分大小写的匹配和多行匹配

注意：当使用构造函数（new RegExp()）创建正则对象时，需要常规的字符转义规则(在前面加反斜杠)。比如，以下是等价的

var reg = new RegExp('\d+');
var reg = /d+/;

常用方法

reg.test(str) => 按照规则校验字符串是否符合，返回true/false
str.match(reg) => 在字符串中按照规则查找，返回数组
str.search(reg) => 在字符串中按照规则查找，返回(第一个符合条件的)下标

注：str是字符串，reg是正则表达式

修饰符(可随意组合)

i 执行对大小写不敏感(不区分)的匹配。
g 执行全局匹配（查找所有匹配而非在找到第一个匹配后停止）。
m 执行多行匹配。

注意事项： m修饰符的作用是修改^和$在正则表达式中的作用，让它们分别表示行首和行尾。
         在默认状态下，一个字符串无论是否存在换行符( )只有一个开始^和结尾$，如果采用多行匹配，那么每一个换行符( )都有一个^和结尾$。

var str = 'This TEACHER is very good at teaching. Students like her VERY much.'

var reg = /er/
console.log(str.match(reg)) //[er] => (very)

var reg1 = /er/i
console.log(str.match(reg1)) //[ER] => (TEACHER)

var reg2 = /er/g
console.log(str.match(reg2)) //[er, er] => (very, her)

var reg3 = /er$/m
console.log(str.match(reg3)) //null

var reg4 = /er/ig
console.log(str.match(reg4)) //[ER, er, er, ER] => (TEACHER, very, her, VERY)

var reg5 = /er$/im
console.log(str.match(reg5)) //null

var reg6 = /er$/gm
console.log(str.match(reg6)) //null

var reg7 = /er$/igm
console.log(str.match(reg7)) //null

第一种，无修饰符，将匹配 'er' ，如果匹配到就显示，匹配不到显示null

第二种，加了修饰符i，不区分大小，即可以匹配的类型应该有  'er' , 'eR' , 'Er' , 'ER'

第三种，加了修饰符g，全局匹配，即将所有 'er' 找出来

第四种，加了修饰符m，多行匹配，上面注意事项介绍了，在js代码中 ‘ ’ 是换行符，修饰符m只对 开头'^'和结尾'$' 这两种量词进行多行匹配，即在使用修饰符m的情况下，碰到 ' ' 后，就相当于在其前多了一个结尾 '$'，在其后面多了一个开头 ‘^’,这样说可能不够清楚，看下面分析，将上面demo拿来具体问题具体分析

var str = 'This TEACHER is very good at teaching. Students like her VERY much.'
var reg3 = /er$/m
console.log(str.match(reg3)) //null

其实，一开始看到结果是null，我也是一愣，匹配不到？好吧，分析看看，请看我上面说的（红色字体或者查看注意事项），恩，' '？在str里面是存在，那么根据上面的意思，上面的代码在修饰符m的作用下就变成，下面用截图来展示

看到我上面截图加的结尾符和开头符，是不是有点理解了呢，恩，那么开始按照匹配条件进行匹配， 'er$' , 字符串(str)中最后以$结束前两位字符是'er'的有吗？并没有符合要求的，所以就返回null，如果换成英文的小数点 'g.'或 'h.' 就可找到，不信的可以试试。

var str = 'This TEACHER is very good at teaching.
 Students like her VERY much.'
var reg3 = /g.$/m
console.log(str.match(reg3)) // [ 'g.' ] => (teaching.)

var str = 'This TEACHER is very good at teaching.
 Students like her VERY much.'
var reg3 = /h.$/m
console.log(str.match(reg3)) // [ 'h.' ] => (much.)

相信，前面这几种分析完后，后面的大家一看就能够明白，后面的就不浪费口舌了，大家自行消化。（相信大家都是大牛，不用来看我写的博客）

方括号

[abc] 查找方括号之间的任何字符。
[^abc] 查找任何不在方括号之间的字符。
[0-9] 查找任何从 0 至 9 的数字。
[a-z] 查找任何从小写 a 到小写 z 的字符。
[A-Z] 查找任何从大写 A 到大写 Z 的字符。
[A-z] 查找任何从大写 A 到小写 z 的字符。
(red|blue|green) 查找任何指定的选项。

// [abc]:
var str = 'this is RegExp grammar'
var reg = /[a-g]/g
console.log(str.match(reg)) // [ "e", "g", "g", "a", "a" ]

// [^abc]:
var str = 'this is RegExp grammar'
var reg = /[^a-g]/g
console.log(str.match(reg)) // ["t", "h", "i", "s", " ", "i", "s", " ", "R", "E", "x", "p", " ", "r", "m", "m", "r"]

// [0-9]:
var str = 'sd12452asdfd'
var reg = /[0-9]/g
console.log(str.match(reg)) // ["1", "2", "4", "5", "2"]

// [a-z]:
var str = 'sd12452asdfd'
var reg = /[a-z]/g
console.log(str.match(reg)) // ["s", "d", "a", "s", "d", "f", "d"]

// [A-Z]:
var str = 'sd12452Asdfd'
var reg = /[A-Z]/g
console.log(str.match(reg)) // ["A"]
// (ab|bc|cd):
var str = 'abcad'
var reg = /(bc|ab|cd)/g
console.log(str.match(reg)) // ["ab"]

这些都是很简单的匹配，相信大家一看就能明白。这里就只给出说明和例子，下面开始要集中精神啦。

元字符

. 查找单个字符，除了换行和行结束符。(注：行结束符在Linux和Windows是不同的，Linux是 ' ', Windows是 ' ',这个需要注意)
w 查找单词字符。(单词字符包括：a-z、A-Z、0-9，以及下划线, 包含 _ (下划线) 字符。)
W 查找非单词字符。
d 查找数字。
D 查找非数字字符。
s 查找空白字符。( ' ', ' ', ' ', ' ', 'v', 'f')
S 查找非空白字符。
 匹配单词边界。(查找位于单词的开头或结尾的匹配。)
B 匹配非单词边界。
查找 NULL 字符。
查找换行符。
f 查找换页符。
查找回车符。
查找制表符。
v 查找垂直制表符。
xxx 查找以八进制数 xxx 规定的字符。
xdd 查找以十六进制数 dd 规定的字符。
uxxxx 查找以十六进制数 xxxx 规定的 Unicode 字符。

上面是说明介绍，下面我们逐一分析

. 查找单个字符，除了换行和行结束符。

// new RegExp('regexp.') or /regexp./

var str = 'That is hot'
var reg = /h.t/g
console.log(str.match(reg))  // [hat, hot] => (That, hot)

var str = 'Tha
t is hot'
var reg = /.t/g
console.log(str.match(reg)) // [ot] => (hot)

w 查找单词字符。单词字符包括：a-z、A-Z、0-9，以及下划线, 包含 _ (下划线) 字符。

// new RegExp('w') or /w/

var str = 'this is word, this is ￥'
var reg = /w/
console.log(str.match(reg)) // [t] 
var reg = /w/g
console.log(str.match(reg)) // ["t", "h", "i", "s", "i", "s", "w", "o", "r", "d", "t", "h", "i", "s", "i", "s"]

W 查找非单词字符。单词字符包括：a-z、A-Z、0-9，以及下划线, 包含 _ (下划线) 字符。

// new RegExp('W') or /W/

var str = 'this is word, this is ￥'
var reg = /W/
console.log(str.match(reg)) // [ '' ]
var reg = /W/g
console.log(str.match(reg)) // [ ' ', ' ', ',', ' ', ' ', ' ', '￥' ]

d 查找数字。

// new RegExp('d') or /d/

var str = 'please pay me 100'
var reg = /d/g
console.log(str.match(reg)) // [ "1", "0", "0" ]

D 查找非数字字符。

// new RegExp('D') or /D/

var str = 'please pay me 100'
var reg = /D/g
console.log(str.match(reg)) // ["p", "l", "e", "a", "s", "e", " ", "p", "a", "y", " ", "m", "e", " "]

s 查找空白字符。

// 空格符    => ' '     (space character) 
// 制表符    => '	'    (tab character)
// 回车符    => '
'    (carriage return character)
// 换行符    => '
'    (new line character)
// 垂直换行符 => 'v'    (vertical tab character)
// 换页符    => 'f'    (form feed character)
// new RegExp('s') or /s/

 var str = ' vf'
 var reg = /s/g
 console.log(str.match(reg))

 结果在谷歌和火狐的展示是不同的，但是结果是一样的。

谷歌：

火狐：

S 查找非空白字符。

// 空格符 (space character)
// 制表符 (tab character)
// 回车符 (carriage return character)
// 换行符 (new line character)
// 垂直换行符 (vertical tab character)
// 换页符 (form feed character)
// new RegExp('s') or /s/

// new RegExp('S') or /S/

var str = 'please pay me 100 !
'
var reg = /S/g
console.log(str.match(reg)) // ["p", "l", "e", "a", "s", "e", "p", "a", "y", "m", "e", "1", "0", "0", "!"]

 匹配单词边界。查找位于单词的开头或结尾的匹配。

//     new RegExp('') or //

var str="JavaScript and testJava, thisisJavaScript."; 
var patt1=/Java/g; //只要以Java开头就能匹配到
var patt2=/Java/g;    //只要以Java结束就能匹配到
console.log(str.match(patt1)); // [Java] => (JavaScript)
console.log(str.match(patt2))  // [Java] => (testJava)

B 匹配非单词边界。

//     new RegExp('B') or /B/

var str="JavaScript and testJava, thisisJavaScript."; 
var patt1=/BJava/g; //只要不是以Java开头就能匹配到
var patt2=/JavaB/g;    //只要不是以Java结束就能匹配到
console.log(str.match(patt1)); //[Java, Java] => (testJava, thisisJavaScript)
console.log(str.match(patt2))  //[Java, Java] => (JavaScript, thisisJavaScript)

 : 用于匹配转义字符 ''(空字符)  =>  空字符 不等于 空白符 [ x0B f ] 

  查找换行符。

  f 查找换页符。

  查找回车符。

  查找制表符。

  v 查找垂直制表符。

上面这几个比较简单，都是正常用法，就不介绍了。

xxx: 用于查找以八进制数 xxx 规定的字符。

//     new RegExp('xxx') or /xxx/

var str="this is javascript"; 
var reg=/141/g; 
console.log(str.match(reg)); // [a, a] => (javascript)

xdd: 用于查找以十六进制数 dd 规定的字符。

//     new RegExp('xdd') or /xdd/

var str="this is javascript"; 
var reg=/x61/g; 
console.log(str.match(reg)); // [a, a] => (javascript)

uxxxx: 查找以十六进制数 xxxx 规定的 Unicode 字符。

//     new RegExp('uxxxx') or /uxxxx/

var str="this is javascript"; 
var reg=/u0061/g; 
console.log(str.match(reg)); // [a, a] => (javascript)

量词

n+ 匹配任何包含至少一个 n 的字符串。

// new RegExp('n+') or  /n+/

var str = 'abcddefdsas'
var reg = /a+/g
console.log(str.match(reg))  // [a,a]
console.log(str.search(reg)) // 0
console.log(reg.test(str))   // true

n* 匹配任何包含零个或多个 n 的字符串。

// new RegExp('n*') or /n*/

var str = 'abcddefdsas'
var reg = /a*/g
console.log(str.match(reg))  // ["a", "", "", "", "", "", "", "", "", "a", "", ""]
console.log(str.search(reg)) // 0
console.log(reg.test(str))   // true

n? 匹配任何包含零个或一个 n 的字符串。

// new RegExp('n?') or /n?/

var str = 'abcddefdsas'
var reg = /a?/g
console.log(str.match(reg))  // ["a", "", "", "", "", "", "", "", "", "a", "", ""]
console.log(str.search(reg)) // 0
console.log(reg.test(str))   // true

n{X} 匹配包含 X 个 n 的序列的字符串。 (X是正整数)

// new RegExp('n{X}') or /n{X}/

var str = 'aabcddefdsas'
var reg = /a{1}/g
console.log(str.match(reg))  // ["a", "a", "a"]
console.log(str.search(reg)) // 0
console.log(reg.test(str))   // true

n{X,} 匹配包含 X 个 n 的序列的字符串。但是n必须连续出现至少X次 (X是正整数)

// new RegExp('n{X,}') or /n{X,}/

var str = 'aabcddefdsas'
var reg = /a{1,}/g
console.log(str.match(reg))   // ["aa", "a"]
console.log(str.search(reg))  // 0
console.log(reg.test(str))    // true

n{X,Y} 匹配包含至少 X 个 n,至多 Y 个 n的序列的字符串。(X,Y都是正整数)

// > new RegExp('n{X,Y}') or /n{X,Y}/

var str = 'aabcddaaaaaefdsas'
var reg = /a{1,3}/g
console.log(str.match(reg))    // ["aa", "aaa", "aa", "a"]
console.log(str.search(reg))   // 0
console.log(reg.test(str))     // true

^n 匹配任何开头为 n 的字符串。

// new RegExp('^n') or /^n/

var str = 'issue is javascript'
var reg = /^is/g
console.log(str.match(reg))   // ["is"]
console.log(str.search(reg))  // 0
console.log(reg.test(str))    // true

n$ 匹配任何结尾为 n 的字符串。

// new RegExp('n$') or /n$/

var str = 'What a fine day!'
var reg = /!$/g
console.log(str.match(reg))   // [!]
console.log(str.search(reg))  // 15
console.log(reg.test(str))    // true

?=n 匹配任何其后紧接指定字符串 n 的字符串。

// new RegExp('regexp()?=n') or /regexp(?=n)/

var str = 'this is javaScript not java'
var reg1 = /is(?= java)/g
console.log(str.match(reg1))  // [is] => (is java)

var str = 'thisisjavascriptnotjava'
var reg1 = /is(?=java)/g
console.log(str.match(reg1))  // [is] => (isjava)

?!n 量词匹配其后没有紧接指定字符串 n 的任何字符串。 

// new RegExp('regexp()?!n') or /regexp(?!n)/

var str = 'this is javaScript not java'
var reg1 = /is(?! java)/g 
console.log(str.match(reg1))  // [is] => (this)

var str = 'this is javaScript not java'
var reg1 = /is(?!java)/g 
console.log(str.match(reg1))  // [is is] => (this is)

上面量词的介绍，语法，demo我都给了出来了，大家多看几遍或者拿到自己本地跑跑看，稍微思考一下应该都能懂。

方法

exec() 方法用于检索字符串中的正则表达式的匹配。如果字符串中有匹配的值返回该匹配值，否则返回 null。多次使用此方法，该方法会在检索不到值（返回null）的情况后，再次检索又从新开始检索。下面demo有分析

• RegExpObject.exec(string)
• string 必须,要搜索的字符串

var str = 'this is RegExp RegExp'
var reg = /RegExp/g;
console.log(reg.exec(str))  // ["RegExp", index: 8, input: "this is RegExp RegExp"] => (谷歌浏览器) |  ["RegExp"] => (火狐浏览器)
console.log(reg.exec(str))  // ["RegExp", index: 15, input: "this is RegExp RegExp"] => (谷歌浏览器) |  ["RegExp"] => (火狐浏览器) 
console.log(reg.exec(str))  // null
console.log(reg.exec(str))  // ["RegExp", index: 8, input: "this is RegExp RegExp"] => (谷歌浏览器) |  ["RegExp"] => (火狐浏览器)

 

test()检索字符串中指定的值。返回 true 或 false。

• RegExpObject.test(string)
• string 必需。要检测的字符串。

var str = 'this is JavaScript'
var reg = /java/gi
console.log(reg.test(str)) // true

 

toString()方法返回正则表达式的字符串值。

• RegExpObject.toString()

var reg = new RegExp('javascript', 'g')
console.log(reg)
console.log(reg.toString())

谷歌：

火狐：

支持正则表达式的String对象的方法

search()方法用于检索字符串中指定的子字符串，返回其下标。如果没有找到任何匹配的子串，则返回 -1。

• string.search(searchvalue)
• searchvalue 必须。查找的字符串或者正则表达式。

var str = 'not java,this is javascript'
var reg = /java/g
console.log(str.search(reg)) // 4

var str = 'this is javascript'
var reg = 'java'
console.log(str.search(reg)) // 8

 

match() 方法可在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。

• string.match(regexp)
• regexp 必需。规定要匹配的模式的 RegExp 对象。如果该参数不是 RegExp 对象，则需要首先把它传递给 RegExp 构造函数，将其转换为 RegExp 对象。

var str = 'not java,this is javascript'
var reg = /java/g
console.log(str.match(reg)) // [java, java] => (not java, is javascript)

 

replace() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。

• string.replace(searchvalue,newvalue)
• searchvalue 必须。规定子字符串或要替换的模式的 RegExp 对象。请注意，如果该值是一个字符串，则将它作为要检索的直接量文本模式，而不是首先被转换为 RegExp 对象。
• newvalue 必需。一个字符串值。规定了替换文本或生成替换文本的函数。

var str = 'not java,this is javascript'
var reg = /java/g
var newStr = 'VB'
console.log(str.replace(reg, newStr))  // not VB,this is VBscript

var str = 'not java,this is javascript'
var reg = 'java'
var newStr = 'VB'
console.log(str.replace(reg, newStr)) // not VB,this is javascript

 

split() 方法用于把一个字符串分割成字符串数组。

• string.split(separator,limit)
• separator 可选。字符串或正则表达式，从该参数指定的地方分割 string Object。
• limit 可选。该参数可指定返回的数组的最大长度。如果设置了该参数，返回的子串不会多于这个参数指定的数组。如果没有设置该参数，整个字符串都会被分割，不考虑它的长度。

var colors = "red,blue,green,yellow";
console.log(colors.split(/[^\,]+/));  // ["", ",", ",", ",", ""]

上面几个方法都还是挺好理解的，但是上面这个split这个demo我个人思考了很久，后面再写几个小demo后才将其理解透。

var colors = colorText.match(/\,/g); //[ ",", ",", "," ]
console.log(colors) //将所有的逗号 ',' 查询出来并放到数组里面去

首先我将里面的正则表达式进行分解，拿到最简单的正则表达式 =>  /\,/g   其实就是将查询到所有的逗号。

var colorText = "red,blue,green,yellow";
var colors1 = colorText.match(/^\,/g); //null
console.log(colors1) //逗号 ',' 开头， 找不到为null

我继续将正则表达式进一步添加条件后， 查询必须是逗号开头的匹配条件，当然啦，我们这里的字符串肯定找不到。

var colorText = "red,blue,green,yellow";
var colors2 = colorText.match(/[^\,]/g); //["r", "e", "d", "b", "l", "u", "e", "g", "r", "e", "e", "n", "y", "e", "l", "l", "o", "w"]
console.log(colors2) //将只要不是逗号 ',' 分隔的都检索出来

将中括号加上去，额，发现这下子是将符合逗号这个条件给排除了，那么就是除逗号以外的都是符合要求的。

var colorText = "red,blue,green,yellow";
var colors3 = colorText.match(/[^\,]+/g); //["red", "blue", "green", "yellow"]
console.log(colors3) //检索出 一至多 除去逗号以外的字符

将正则表达式完善到跟上面一开始demo的一样， /[^\,]+  相当于  n+（即可以看做  {1,}  ） ， n就是上面那个除逗号以外条件， 即除了逗号以外的字符至少要有一个， 那么 'r', 'e', 'd'都不是逗号，

而且red后面是逗号，那么 'red' 这三个字符符合 一至多字符，分为一组，那么在下一个逗号之前的blue也是一组，green也是一组，yellow页没有是逗号的也是一组。