经常使用正则表达式

时间 2019-11-08

标签经常使用正则表达式栏目正则表达式繁體版

原文原文链接

验证姓名

2 到 9 位中文昵称：^[\u4e00-\u9fa5]{2,9}$

验证密码

只能是字母、数字和下划线，长度不限制：^\w+$
容许小写字母 a-z、大写字母 A-Z、数字 0-9、下划线 _、链接符 -，且长度在 6-18 位数：/^[a-zA-Z0-9_-]{6,18}$/
必须包含数字+小写字母+大写字母的密码，且长度在8-10位之间：^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,10}$

验证 Email

容许有一个字符符合 [A-Za-z0-9_] 以后能够为 [A-Za-z0-9_-+.] + @ + 容许有一个字符符合 [A-Za-z0-9_] 以后能够为 [A-Za-z0-9_-.] + . + 容许有一个字符符合 [A-Za-z0-9_] 以后能够有 [A-Za-z0-9_-.] 的邮箱：^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$

验证身份证

18 位身份证号，尾数是数字或者字母 X：^(\d{6})(\d{4})(\d{2})(\d{2})(\d{3})([0-9]|X)$
15 或者 18 位身份证号，尾数能够是数字及 X 或者 x：(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)

验证手机号

以 1 开头，第二位数是 3/4/5/7/8 的 11 位手机号码：^1[3,4,5,7,8,9]\d{9}$
移动号码：^134[0-8]\d{7}$|^(?:13[5-9]|147|15[0-27-9]|178|1703|1705|1706|18[2-478])\d{7,8}$
电信号码：^(?:133|153|1700|1701|1702|177|173|18[019])\d{7,8}$
联通号码：^(?:13[0-2]|145|15[56]|176|1704|1707|1708|1709|171|18[56])\d{7,8}|$

匹配规则

字符	描述	例子
`\`	将下一个字符标记为特殊字符、或原义字符、或向后引用、或八进制转义符。	`\n` 表示换行符、`\d` 匹配 [0-9] 的数字
`^`	匹配输入字符串的开始位置。	`^abc` 表示匹配有 abc 开头的字符串
`$`	匹配输入字符串的结束位置。	`^\d$` 表示匹配一个 [0-9] 的数字
`*`	匹配前面的子表达式零次或屡次。	`zo` 能匹配 `z` 或者 `zoo`。`` 等价于 `{0,}`。
`+`	匹配前面的子表达式一次或屡次。	`zo+` 能匹配 `zo` 或者 `zoo`，但不能匹配 `z`。`+` 等价于 `{1,}`。
`?`	匹配前面的子表达式零次或一次。	`do(es)?` 能够匹配 `does` 或 `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)` 的模式。要匹配小数点自己，请使用 `\.`。`a.e` 能匹配 `nave` 中的 `ave` 或者匹配 `water` 中的 `ate`
`(子表达式)`	标记一个子表达式的开始和结束位置。	`(\w)\1` 能匹配 `deep` 中的 `ee`
`(?:子表达式)`	匹配 z子表达式但不获取匹配结果，也就是说这是一个非获取匹配，不进行存储供之后使用。这在使用或字符 `(\|)` 来组合一个模式的各个部分是颇有用。	`industr(?:y\|ies)` 就是一个等同于 `industry\|industries` 但更简略的正则表达式。
`(?=子表达式)`	通常用法：`××(?=子表达式)`，它的意思就是 `××` 后面的条件限制是 `?=` 后面的 `子表达式`	`Windows(?=95\|98\|NT\|2000)` 能匹配 `Windows2000` 中的 `Windows`，但不能匹配 `Windows3.1` 中的 `Windows`。`\w+(?=\.)` 能匹配 `He is. The dog ran. The sun is out.` 中的 `is`、`ran` 和 `out`
`(?!子表达式)`	相似于 `(?=子表达式)`，表示不等于后面的 `子表达式`。	`Windows(?!95\|98\|NT\|2000)` 能匹配 `Windows3.1` 中的 `Windows`，但不能匹配 `Windows2000` 中的 `Windows`。`\b(?!un)\w+\b` 能匹配 `unsure sure unity used` 中的 `sure` 和 `used`
`(?<=子表达式)`	同上。	`(?<=95\|98\|NT\|2000)Windows` 能匹配 `2000Windows` 中的 `Windows`，但不能匹配 `3.1Windows` 中的`Windows`。`(?<=19)\d{2}\b` 能匹配 `1851 1999 1950 1905 2003` 中的 `99`、`50` 和 `05`
`(?<!子表达式)`	同上。	`(?<!95\|98\|NT\|2000)Windows` 能匹配 `3.1Windows` 中的 `Windows`，但不能匹配 `2000Windows` 中的 `Windows`。`\b(?!un)\w+\b` 能匹配 `unsure sure unity used` 中的 `sure` 和 `used`
`x\|y`	匹配 x 或者 y。	`z\|food` 能匹配 `z` 或者 `food`。`(z\|f)ood` 则匹配 `zood` 或 `food`。
`[xyz]`	字符集合。匹配所包含的任意一个字符。	`[abc]` 能够匹配 `plain` 中的 `a`。
`[^xyz]`	求反。匹配未包含的任意字符。	例如，`[^abc]` 能够匹配 `plain` 中的 `p`。`[^aei]` 匹配 `reign` 中的 `r`、`g` 和 `n`
`[a-z]`	字符范围。匹配指定范围内的任意字符。	`[a-z]` 能够匹配 `a` 到 `z` 范围内的任意小写字母字符。注意：`[A-Z]` 才匹配大写英文字母
`[^a-z]`	求反。匹配任何不在指定范围内的任意字符。	`[^a-z]` 能够匹配任何不在 `a` 到 `z` 范围内的任意字符。
`\b`	匹配一个单词边界，也就是指单词和空格间的位置。	`er\b` 能够匹配 `never` 中的 `er`，但不能匹配 `verb` 中的 `er`。
`\B`	匹配非单词边界。	`er\B` 能匹配 `verb` 中的 `er`，但不能匹配 `never` 中的 `er`。
`\cx`	匹配由 x 指明的控制字符。	例如，`\cM` 匹配一个 `Control-M` 或者回车符。`x` 的值必须为 `A-Z` 或 `a-z` 之一。不然，将 `c` 视为一个原义的 `c` 字符。
`\d`	匹配一个数字字符。等价于[0-9]。	`4 = IV` 中的 `4`
`\D`	匹配一个非数字字符。等价于[^0-9]。	`4 = IV` 中的、`=`、、`I` 和 `V`
`\f`	匹配一个换页符。等价于\x0c和\cL。	`[\f]{2,}` 能匹配 `\f\f\f` 中的 `\f\f\f`。
`\n`	匹配一个换行符。等价于\x0a和\cJ。	`\r\n(\w+)` 能匹配 `\r\nThese are\ntwo lines.` 中的 `\r\nThese`
`\r`	匹配一个回车符。等价于\x0d和\cM。	`\r\n(\w+)` 能匹配 `\r\nThese are\ntwo lines.` 中的 `\r\nThese`
`\s`	匹配任何空白字符，包括空格、制表符、换页符等等。等价于[ \f\n\r\t\v]。	`\w\s` 能匹配 `ID A1.3` 中的 `D`
`\S`	匹配任何非空白字符。等价于[^ \f\n\r\t\v]。	`\s\S` 能匹配 `int __ctr` 中的 `_`
`\t`	匹配一个制表符。等价于\x09和\cI。	`(\w+)\t` 能匹配 `item1\titem2\t` 中的 `item1\t` 和 `item2\t`
`\v`	匹配一个垂直制表符。等价于\x0b和\cK。	`[\v]{2,}` 能匹配 `\v\v\v` 中的 `\v\v\v`
`\w`	匹配包括下划线的任何单词字符。等价于 `[A-Za-z0-9_]`。	`ID A1.3` 中的 `I`、`D`、`A`、`1` 和 `3`
`\W`	匹配任何非单词字符。等价于 `[^A-Za-z0-9_]`。	`ID A1.3` 中的、`.`。

经常使用方法

JavaScript 正则默认：正则匹配成功就会结束，不会继续匹配。若是想查找所有，就要加标识 g（全局匹配）html

test()

规则：正则表达式搜索字符串指定的值，从而去匹配字符串。若是匹配成功就返回 true，若是匹配失败就返回 false。
用法：正则.test(字符串)
案例：正则表达式

js 代码片断数组

var str = "123abc";
var re = /\D/; // 匹配非数字
if(re.test(str)) {
  console.log("不全是数字！");
} else {
  console.log("全是数字！");
}

复制代码

Console：不全是数字bash

search()

规则：正则去匹配字符串，若是匹配成功，就返回匹配成功的位置，若是匹配失败就返回 -1
用法：字符串.search(正则)
案例：函数

js 代码片断学习

var str = "abcdef";
var re1 = /d/i; // 3
var re2 = /h/i; // -1
console.log(str.search(re1));
console.log(str.search(re2));

复制代码

Console：3-1测试

match()

规则：正则去匹配字符串，若是匹配成功，就返回匹配成功的数组，若是匹配不成，就返回 null
用法：字符串.match(正则)
案例：ui

js 代码片断spa

var str = "123fadf321dfadf4fadf1"; //(4) ["123", "321", "4", "1"]
var re = /\d+/g;
console.log(str.match(re));

复制代码

Console：(4) ["123", "321", "4", "1"]scala

replace()

规则：正则去匹配字符串，匹配成功的字符串去替换成新的字符串。函数的第一个参数，是匹配成功的字符；第二个参数：能够是字符串，也能够是一个回调函数。
用法：字符串.replace(正则,新的字符串)
案例：

简单案例

js 代码片断

var str = 'aaa';
var re = /a+/g;
str = str.replace(re, "b");
console.log(str); // b

复制代码

Console：b

敏感词过滤

html 代码片断

<div class="filtering-of-sensitive-words">
  <h3>敏感词过滤</h3>
  <p>替换前</p>
  <textarea name="before" id="" cols="30" rows="10"></textarea>
  <input type="button" value="肯定" id="input1">
  <p>替换后</p>
  <textarea name="after" id="" cols="30" rows="10"></textarea>
</div>

复制代码

js 代码片断

window.onload = function() {
  var aT = document.getElementsByTagName("textarea");
  var oInput = document.getElementById("input1");

  var re = /非诚|中国船|监视之下/g;

  oInput.onclick = function() {
    // 一概单个替换： aT[1].value = at[0].value.replace(re, "*");
    // 多个替换：
    aT[1].value = aT[0].value.replace(re, function(str) {
      var result = "";
      for(var i=0; i<str.length; i++) {
        result += "*";
      }
      return result;
    });
  }
}

复制代码

Console
替换前：非诚勿扰在中国船的监视之下步履维艰
替换后：**勿扰在***的****步履维艰

正则旅途

什么是正则表达式？正则表达式：正则，也叫作规则，让计算机可以读懂人类的规则。
正则表达式都是用来操做字符串的。

本文学习目标：

经过小故事给小伙伴学习 JavaScript 的正则表达式
让小伙伴能了解基本正则表达式的意思，并能本身写正则表达式

初识正则

正则长咋样？怎么用？很简单，三行代码带你入门

var regex = /^\d+$/;
var myNumber = '123';
console.log(regex.test(myNumber)); // true

复制代码

上面的正则，能验证字符串 myNumber 是否是纯数字组成，就这么简单，正则入门了！
可是，若是我要是敢就这么结束文章，我敢保证大家想拍死我！因此，咱们经过一个表达式的故事来初识正则表达式：

某天，盗贼小白给了盗贼小黑一个盒子，盒子像俄罗斯套娃同样，有 3 层嵌套：

而且，他们约定了交易密码提取方式：小白将给小黑提供一串字符串，小黑只须要将字符串中的全部相连的数字找出来，而后把它们拼接成一个新数组，数组的第一项就是第一个盒子的密码，以此类推……

"abc123def456hash789" -> [123, 456, 789] - > [外层盒子1密码, 中间层盒子2密码, 最内层盒子3密码]

如今假设盗贼小黑使用 JavaScript 进行常规查找：

index.html

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>正则表达式</title>
</head>

<body>
  <p>正则表达式 | <b>jsliang</b> 学习记录</p>

  <script>
    window.onload = function () {
      var str = "abc123def456hash789"

      function findNum(str) {
        var arr = [];
        var tmp = '';
        for (var i = 0; i < str.length; i++) {
          if (str.charAt(i) >= "0" && str.charAt(i) <= "9") {
            tmp += str.charAt(i);
          } else {
            if (tmp) {
              arr.push(tmp);
              tmp = "";
            }
          }
        }
        if (tmp) {
          arr.push(tmp);
          tmp = "";
        }
        return arr;
      }
      console.log(findNum(str));
    }
  </script>
</body>

</html>

复制代码

写到这里，小黑以为不妥，上面代码写得太麻烦太复杂了，因而决定使用正则表达式查找：

index.html

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>正则表达式</title>
</head>

<body>
  <p>正则表达式 | <b>jsliang</b> 学习记录</p>

  <script>
    window.onload = function() {
      var str = "abc123def456hash789";
      function findNum(str) {
        return str.match(/\d+/g);
      }
      console.log(findNum(str));
    }
  </script>
</body>

</html>

复制代码

小黑瞬间以为本身很牛逼有木有？！只须要一行代码，就能解决字符串查找的时候用的一大串代码！

那么，讲到这里，小伙伴们应该对正则有了个简单的了解，称热打铁，Here we go~

正则解析

在上文中，盗贼小黑经过使用 str.match(/\d+/g)，解决了获取箱子密码的问题。
那么，这串正则表达式是什么意思呢？咱们先抛开这个，解析一串简单的：

^[a-z0-9_-]{6,12}$

首先，^ 表示匹配字符串的开始位置，结合后面的 [a-z0-9_-] 表示该字符串开头能够为 a-z 的字母，0-9 的数字，_ 下划线，- 链接符。
而后，[a-z] 表示匹配 a-z 中任意单个字母；[0-9] 表示匹配 0-9 中任意单个数字；[_] 表示匹配下划线；[-] 表示匹配链接符 -。因此，将前面的连起来，[a-z0-9_-] 表示字符串能够包含数字、字母、_、- 这四种形式的字符串。
接着，{6, 12} 表示该字符串的长度为 6-12 位。
最后，$ 表示结束标志，^ 的相反。

^ 与 $ 同时使用时，表示精确匹配。

终上所述，小伙伴们应该猜想到了这个正则表达式的用途：校验用户名。该用户名只能包含字符、数字、下划线 (_) 和链接字符 (-)，而且用户名的长度最长为 12 位，最短为 6 位。

那么，它在 JavaScript 中要如何使用呢？咱们一般用 /正则表达式/ 两个斜杠来包裹咱们要写的正则表达式：

var reg = /^[a-z0-9_-]{6,12}$/

复制代码

看，这样就是一条规则了，若是你须要让他匹配一个字符串 str。那么，只须要在代码中使用 test() 测试方法：

var str = 'abc-cba_abc';
var reg = /^[a-z0-9_-]{6,12}$/;
console.log(reg.test(str)); // true

复制代码

这样，咱们就告诉了 JavaScript：reg 经过 test() 方法去测试 str 是否符合 reg的规则，若是符合则返回 true，若是不符合则返回 false。这里返回的是 true，由于咱们的 str 是符合 reg 规则的。

test() 方法及其余好用的方法已经整合到【2.3 JS 正则方法】里面了，火烧眉毛的小伙伴们可点击连接先行查看。

下面贴出完整代码：

index.html

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>正则表达式</title>
</head>

<body>
  <p>正则表达式 | <b>jsliang</b> 学习记录</p>

  <script>
    window.onload = function() {
      var str = 'abc-cba_abc';
      var reg = /^[a-z0-9_-]{6,12}$/;
      console.log(reg.test(str)); // true
    }
  </script>
</body>

</html>

复制代码

正则练习

经过上面的了解，小伙伴对正则表达式应该有了初始的了解，下面咱们猜想一下，下面的 Console 1 - Console 3中，哪些是 true，哪些是 false：

index.html

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>正则表达式</title>
</head>

<body>
  <p>正则表达式 | <b>jsliang</b> 学习记录</p>

  <script>
    window.onload = function() {
      var str = "Cheer for yourself";
      var reg1 = /^Cheer/;
      var reg2 = /yourself$/;
      var reg3 = /for/;
      console.log(reg1.test(str));
      console.log(reg2.test(str));
      console.log(reg3.test(str));
    }
  </script>
</body>

</html>

复制代码

答案是，这三个都返回 true。在这三个 console.log() 中：
第一个判断该字符串是否以 Cheer 开头；
第二个判断该字符串是否以 yourself 结尾；
第三个判断该字符串是否包含 for。
在平常工做中，常常利用该方法，判断用户输入的 string 里面是否包含某些文字，例如：jsliang 是傻逼，就须要判断替换为 jsliang 是帅哥，至于怎么替换敏感字，火烧眉毛的小伙伴们可前往【2.3 JS 正则方法】先行了解~

渐入佳境：() 匹配子项

所谓匹配子项，其实就是咱们的小括号 () 。它还有另一个意思，叫分组操做。下面咱们引用章节【2.2 正则表达式规则】中的定义：

表达式	释义	用法
`(子表达式)`	标记一个子表达式的开始和结束位置。	`(\w)\1` 能匹配 `deep` 中的 `ee`

若是光解释意思，小伙伴们可能稀里糊涂。因此咱们先上代码：

js 代码片断

var str = "2018-11-28";
var re = /(\d+)(-)/g;
str = str.replace(re, function($0, $1, $2){
  // 第一个参数：$0（母亲)
  // 第二个参数：$1（第一个孩子）
  // 第三个参数：$2 (第二个孩子)
  console.log("$0：" + $0); // 2018- 以及 11-
  console.log("$1：" + $1); // 2018 以及 11
  console.log("$2：" + $2); // - 以及 -
  return $1 + '.';
});
console.log(str); // 2018.11.28

复制代码

Console：
$0：2018-
$1：2018
$2：-
$0：11-
$1：11
$2：-
2018.11.28

首先，咱们解析下这段正则：

/(\d+)/ 表示任意 1 个及以上的数字
/(-)/ 表示匹配字符 -
g 表示匹配一次以上

因此这段正则的意思就是匹配一次及以上的 数字- 形式的字符串。而后，咱们使用了 replace() 方法。咱们观察 Console 打印出来的结果，能够看出：$0 便是咱们的正则 var re = /(\d+)(-)/g 去匹配 var str = "2018-11-28" 所获得的结果，这里咱们匹配成功了两次，即 2018- 及 11-；$1 便是咱们的一个小括号 (\d+) 的匹配结果，因此结果为 2018 以及 11；$2 便是咱们的第二个小括号 (-) 的匹配结果，因此结果为 - 以及 -。
最后，咱们作的事情就是，将 $1 加上 .，并返回最终结果给 str，即最终结果：2018.11.28。

在这里提到了 replace() 方法，详情可了解：点击前往

【Once again】 若是小伙伴们感受仍是不过瘾，那么咱们再来一段：

js 代码片断

var str = "abc";
var re = /(a)(b)(c)/;
console.log(str.match(re));

复制代码

Console
(4) ["abc", "a", "b", "c", index: 0, input: "abc", groups: undefined]

这里咱们不作过多讲述，相信小伙伴们通过这两个案例，应该对 () 有了必定的了解。

渐入佳境：[] 字符类

何为字符类？
所谓字符类，就是一组相似的元素 [] 这样的中括号的总体，所表明一个字符。
话很少说，先上代码：

js 代码片断

var str1 = "abcd";
var re1 = /a[bcd]c/;
console.log(re1.test(str1)); // true

var str2 = "abc";
var re2 = /a[^bcd]c/;
console.log(re2.test(str2)); // false

var str3 = "a.c";
var re3 = /a[a-z0-9A-Z]c/;
console.log(re3.test(str3));  // false

复制代码

Console
true
false
false

首先，咱们先解析第一部分：

/a/：匹配字母 a
/[bcd]/：匹配字母 bcd 中的一位
/[d]：匹配字母 d

因此，能够看出，咱们用 re1 来测试 str1 是否符合，它会返回 true。

而后，咱们解析第二部分：

^ 若是写在 [] 里面的话，就表明排除的意思。在这里就表明着 a 和 c 中间不能是 bcd 中的任意一个

因此，能够看出，咱们用 re2 来测试 str1 是否符合，它会返回 false。

最后，咱们解析第三部分：

/[a-z0-9A-Z]/：匹配小写字母 a-z，或者数字 0-9，或者大写字母 A-Z。即 a 与 c 之间只能是上面匹配地上的字符。

因此，能够看出，咱们用 re3 来测试 str3 是否符合，它会返回 false。