正则

正则的概念

正则表达式(regular expression)是一个描述字符规则的对象。可以用来检查一个字符串是否含有某个子字符串，将匹配的子字符串做替换或者从某个字符串中取出符合某个条件的子串等。
为什么要用正则：
前端往往有大量的表单数据校验工作，采用正则表达式会使得数据校验的工作量大大减轻。常用效果：邮箱、手机号、身份证号等。

创建方式

  1. 第一种方式
1
var reg = new RegExp("study"，"ig");   // 第二个参数为修饰符

i：表示忽略大小写 ignore。
g：表示全局匹配，查找所有匹配而非在找到第一个匹配后停止 global。

  1. 第二种方式
1
var reg = /study/gi;

正则对象方法

  1. test： 正则实例对象的 test 方法返回一个布尔值，表示当前模式是否能匹配参数字符串
1
/cat/.test("cats and dogs"); // true

上面代码验证参数字符串之中是否包含 cat，结果返回 true。
如果正则表达式带有 g 修饰符，则每一次 test 方法都从上一次结束的位置开始向后匹配

1
2
3
4
5
6
7
8
9
10
11
var r = /x/g;
var s = "_x_x";

r.lastIndex; // 0
r.test(s); // true

r.lastIndex; // 2
r.test(s); // true

r.lastIndex; // 4
r.test(s); // false

上面代码的正则表达式使用了 g 修饰符，表示是全局搜索，会有多个结果。接着，三次使用 test 方法，每一次开始搜索的位置都是上一次匹配的后一个位置。

带有 g 修饰符时，可以通过正则对象的 lastIndex 属性指定开始搜索的位置

1
2
3
4
5
var r = /x/g;
var s = "_x_x";

r.lastIndex = 4;
r.test(s); // false

上面代码指定从字符串的第五个位置开始搜索，这个位置是没有字符的，所以返回 false。

  1. exec：用于检索字符串中的正则表达式的匹配。返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回值为 null。
1
2
3
4
5
6
var s = "_x_x";
var r1 = /x/;
var r2 = /y/;

r1.exec(s); // ["x"]
r2.exec(s); // null

上面代码中，正则对象 r1 匹配成功，返回一个数组，成员是匹配结果；正则对象 r2 匹配失败，返回 null。

字符串函数

  1. replace： 按照给定的正则表达式进行替换，返回替换后的字符串。
    字符串对象的 replace 方法可以替换匹配的值。它接受两个参数，第一个是正则表达式，表示搜索模式，第二个是替换的内容。
1
str.replace(search, replacement);

正则表达式如果不加 g 修饰符，就替换第一个匹配成功的值，否则替换所有匹配成功的值。

1
2
3
4
"aaa".replace("a", "b"); // "baa"
"aaa".replace(/a/, "b"); // "baa"
"aaa".replace(/a/g, "b"); // "bbb"
//上面代码中，最后一个正则表达式使用了g修饰符，导致所有的b都被替换掉了。
  1. match： 字符串实例对象的 match 方法对字符串进行正则匹配，返回匹配结果。
1
2
3
4
5
6
var s = "_x_x";
var r1 = /x/;
var r2 = /y/;
s.match(r1); //["x"]
s.match(r2); // null
//从上面代码可以看到，字符串的match方法与正则对象的exec方法非常类似：匹配成功返回一个数组，匹配失败返回null。

如果正则表达式带有 g 修饰符，则该方法与正则对象的 exec 方法行为不同，会一次性返回所有匹配成功的结果

1
2
3
4
5
var s = "abba";
var r = /a/g;

s.match(r); // ["a", "a"]
r.exec(s); // ["a"]
  1. search：检索与正则表达式相匹配的值。返回字符串中第一个与正则表达式相匹配的子串的起始位置。如果没有找到则返回-1。
1
2
"_x_x".search(/x/); // 1
//上面代码中，第一个匹配结果出现在字符串的1号位置。

正则表达式的构成

大部分字符在正则表达式中，就是字面的含义，比如/a/匹配 a，/b/匹配 b。如果在正则表达式之中，某个字符只表示它字面的含义（就像前面的 a 和 b），那么它们就叫做“字面量字符”。

1
/dog/.test("old dog"); // true

上面代码中正则表达式的 dog，就是字面量字符，所以/dog/匹配 old dog，因为它就表示 d、o、g 三个字母连在一起。

除了字面量字符以外，还有一部分字符有特殊含义，不代表字面的意思。它们叫做“元字符”，主要有以下几个

正则表达式是由普通字符（例如字符 a 到 z）以及特殊字符（称为元字符）组成的文字模式。正则表达式作为一个模板，将某个字符模式与所搜索的字符串进行匹配。

  1. 元字符-限定符
    限定符可以指定正则表达式的一个给定组件必须要出现多少次才能满足匹配。 *：匹配前面的子表达式零次或多次。 +：匹配前面的子表达式一次或多次。
    ？：匹配前面的子表达式零次或一次。
    {n}：匹配确定 n 次。
    {n,}：至少匹配 n 次。
    {n, m}：最少匹配 n 次且最多匹配 m 次。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
// t 出现0次或1次
/t?est/.test('test') // true
/t?est/.test('est') // true
// t 出现1次或多次
/t+est/.test('test') // true
/t+est/.test('ttest') // true
/t+est/.test('est') // false
// t 出现0次或多次
/t*est/.test('test') // true
/t*est/.test('ttest') // true
/t*est/.test('tttest') // true
/t*est/.test('est') // true

/lo{2}k/.test('look') // true
/lo{2,5}k/.test('looook') // true
//上面代码中，第一个模式指定o连续出现2次，第二个模式指定o连续出现2次到5次之间
  1. 元字符-字符匹配符
    字符匹配符用于匹配某个或某些字符。

[xyz]：字符集合。匹配所包含的任意一个字符。

1
2
3
/[abc]/.test('hello world') // false
/[abc]/.test('apple') // true
//上面代码中，字符串hello world不包含a、b、c这三个字母中的任一个，所以返回false；字符串apple包含字母a，所以返回true

[^xyz]： 表示除了 x、y、z 之外都可以匹配。

1
2
3
/[^abc]/.test('hello world') // true
/[^abc]/.test('bbc') // false
//上面代码中，字符串hello world不包含字母a、b、c中的任一个，所以返回true；字符串bbc不包含a、b、c以外的字母，所以返回false。

[a-z]：字符范围。匹配指定范围内的任意字符。
[abc]可以写成[a-c]，[0123456789]可以写成[0-9]，同理[A-Z]表示 26 个大写字母。

1
/[a-z]/.test("b"); // true

这样也可以：[0-9]、[0-9a-z]、[0-9a-zA-Z]
[0-9a-zA-Z] 表示数字 0-9，大小字母
[^a-z]：表示不包含小写字母。

\d 匹配 0-9 之间的任一数字，相当于[0-9]。
\D 匹配所有 0-9 以外的字符，相当于[^0-9]。
\w 匹配任意的字母、数字和下划线，相当于[A-Za-z0-9_]。
\W 除所有字母、数字和下划线以外的字符，相当于[^A-Za-z0-9_]。
\s 匹配空格（包括换行符、制表符、空格符等）。
\S 匹配非空格的字符。
.：匹配除”\n”之外的任何单个字符。

  1. 元字符-定位符
    定位符可以将一个正则表达式固定在一行的开始或结束。也可以创建只在单词内或只在单词的开始或结尾处出现的正则表达式。
    ^：匹配输入字符串的开始位置。
    $：匹配输入字符串的结束位置。
1
2
3
4
// test必须出现在开始位置/^test/.test('test123') // true
// test必须出现在结束位置/test$/.test('new test') // true
// 从开始位置到结束位置只有test/^test$/.test('test') // true
/^test$/.test("test test"); // false
  1. 元字符-转义符
    \：用于匹配某些特殊字符。
    正则表达式中那些有特殊含义的元字符，如果要匹配它们本身，就需要在它们前面要加上反斜杠。比如要匹配+，就要写成+。
1
2
3
/1+1/.test('1+1')// false
/1\+1/.test('1+1')// true
//上面代码中，第一个正则表达式之所以不匹配，因为加号是元字符，不代表自身。第二个正则表达式使用反斜杠对加号转义，就能匹配成功。
  1. 元字符-选择匹配符
    |：可以匹配多个规则。
    竖线符号（|）在正则表达式中表示“或关系”（OR），即 cat|dog 表示匹配 cat 或 dog。
1
2
3
4
/11|22/.test('911') // true
//上面代码中，正则表达式指定必须匹配11或22
// 匹配fred、barney、betty之中的一个
/fred|barney|betty/

常用正则

  1. 邮政编码检测
1
/^\d{6}$/;
  1. 文件格式监测
1
/^.+\.(jpeg|png|gif|jpg)$/;
  1. 字符串首尾去空格
1
2
3
var str = "     avaasdf ";
var reg = /^\s+|\s+$/g;
console.log(str.replace(reg, ""));
  1. 邮件格式监测
1
/^\w+[-+.]*\w*@([a-z0-9A-Z\u2E80-\u9FFF]-?)+(\.\w{2,6})+/;
  1. 手机号监测
1
/^(13[0-9]|14[0-9]|15[0-9]|18[0-9]|17[0-9])\d{8}$/;
  1. 身份证监测
1
/(^\d{15}$|^\d{18}$)|^\d{17}X$/;
  1. 中文监测
    unicode 编码中文监测
1
/^[\u2E80-\u9FFF]+$/;
  1. 用户名监测（规则数字字母下划线-组成，3-16 位）
1
/^[a-z0-9_-]{3,16}$/;

正则分组

  1. 什么是分组
1
2
3
4
5
6
7
8
9
var reg = /(\d{2})/;
reg.test("12"); //true
// 这里reg中的(/d{2})就表示一个分组，匹配两位数字

/*
/hahaha/
/(ha){3}/
这两个表达式是等效的，但有了分组之后可以更急简洁
*/
  1. 捕获型分组 ()
    被正则表达式捕获(匹配)到的字符串会被暂存起来，其中，由分组捕获到的字符串会从 1 开始编号，于是我们可以引用这些字符串：
1
2
3
4
5
6
7
var reg = /(\d{4})-(\d{2})-(\d{2})/;
var dateStr = "2018-04-18";
reg.test(dateStr); //true
//引用捕获到的内容使用 $1 代表第一个分组的捕获到的内容
RegExp.$1; //2018
RegExp.$2; //04
RegExp.$3; //18
  1. 非捕获型分组 (?:)
    有的时候只是为了分组并不需要捕获的情况下就可以使用非捕获型分组
1
2
3
4
5
var reg = /(?:\d{4})-(\d{2})-(\d{2})/;
var date = "2012-12-21";
reg.test(date);
RegExp.$1; // 12
RegExp.$2; // 21
  1. 结合 replace 方法做自定义替换
1
2
3
4
var dateStr = "2018/04/18";
var reg = /(\d{4})\/(\d{2})\/(\d{2})/;
dateStr = dateStr.replace(reg, "$1-$2-$3"); //"2018-04-18"
//不过这里需要注意的是/是需要用\转义的
  1. 结合正则 exec 方法来使用
    通俗来说，分组就是在正则表达式中用()包起来的内容代表了一个分组
1
2
3
4
5
6
7
8
9
10
11
12
13
14
var re = new RegExp("d(b+)(d)", "ig");
var str = "cdbBdbsbdbdz";
var arr = re.exec(str);
console.log(arr);

/*
0: "dbBd"  正则整体匹配到的字符
1: "bB"    第一个小括号(分组)匹配到的字符
2: "d"     第二个小括号（分组）匹配到的字符
*/
//    第一个分组的结果也可以用 RegExp.$1   获取
s = "$1 contains: " + RegExp.$1 + "\n";
s += "$2 contains: " + RegExp.$2 + "\n";
console.log(s);
  1. 结合字符串 match 方法使用
1
2
3
4
5
6
7
8
9
10
11
12
13
14
var str = "http://www.taobao.com:80/cuxiao/hongbao.html";
var patt1 = /(\w+):\/\/([^/:]+)(:\d*)?([^# ]*)/;
arr = str.match(patt1);
console.log(arr);

/*
0: "http://www.taobao.com:80/cuxiao/hongbao.html"  整个正则匹配到的字符串
1: "http"     第一个分组 匹配到的字符串
2: "www.taobao.com"   第二个分组 匹配到的字符串
3: ":80"      第三个分组 匹配到的字符串
4: "/cuxiao/hongbao.html"   第四个分组 匹配到的字符串
*/
//第一个分组的结果也可以用 RegExp.$1   获取
console.log(RegExp.$1); //http
  1. 常见面试题
1
2
3
4
5
6
7
8
9
10
11
12
13
//把url参数转对象
var parseQuery = function (query) {
  var reg = /([^=&\s]+)[=\s]*([^&\s]*)/g;
  var obj = {};
  while (reg.exec(query)) {
    obj[RegExp.$1] = RegExp.$2;
  }
  console.log(obj);
  return obj;
};
parseQuery(
  "userID=JeoOrCXxyiOFxbYaGL40kw&userPwd=sdFo2ziUw8HyLRKd4i6GAQ&userName=aa"
);

本文作者：人模人样的搬砖老段
本文链接：正则
如有错误，请及时评论或者知乎私信或者 B 站私信哦~

最后更新于:2020/02/02

赏

谢谢你让我少搬一块砖

支付宝
微信

扫一扫，分享到微信

微信分享二维码

tag:

    缺失模块。
    1、请确保node版本大于6.2
    2、在博客根目录（注意不是yilia根目录）执行以下命令：
    npm i hexo-generator-json-content --save

    3、在根目录_config.yml里添加配置： 

      jsonContent:
    meta: false
    pages: false
    posts:
      title: true
      date: true
      path: true
      text: false
      raw: false
      content: false
      slug: false
      updated: false
      comments: false
      link: false
      permalink: false
      excerpt: false
      categories: false
      tags: true

随和且慢热<br><br>你主动我们就会有故事<br><br>爬山爱好者<br><br>马拉松爱好者<br><br>爱好干净、轻微整洁癖