正则表达式

查看原文站点，更多扩展内容及更佳阅读体验！
查看原文：正则表达式

正则表达式

正则表达式是匹配模式，要么匹配字符，要么匹配位置。

字符匹配

两种模糊匹配

正则表达式能实现模糊匹配
模糊匹配，有两个方向上的模糊：横向和纵向

横向模糊匹配

横向模糊指的是，一个正则可匹配的字符串的长度不是固定的
实现方式是使用量词。{m,n}，表示连续出现最少m次，最多n次

/ab{2,5}c/匹配：第一个字符是a，接下来是2到5个字符b，最后是c。

var regex = /ab{2,5}c/g;
var string = "abc abbc abbbc abbbbc abbbbbc abbbbbbc";
console.log(string.match(regex));
//[ 'abbc', 'abbbc', 'abbbbc', 'abbbbbc' ]

纵向模糊匹配

纵向模糊，一个正则匹配的字符串，具体到某一位字符时，它可以不是某个确定的字符，可以有多种可能

实现方式是使用字符组。[abc]，表示该字符可以是a、b、c中的任何一个。

var regex = /a[123]b/g;
var string = "a0b a1b a2b a3b a4b";
console.log(string.match(regex));
//[ 'a1b', 'a2b', 'a3b' ]

字符组

虽然叫字符组（字符类），但只是匹配其中一个字符。[abc]表示匹配一个字符，它可以是a、b、c。

范围表示法

字符组里的字符比较多，可以使用范围表示法。

[123456abcdefGHIJKLM]可以写成[1-6a-fG-M]。用连字符-来省略和简写。
匹配a、-、z这三者中任意一个字符，可以写成[-az]或[a\-z]。要么放在开头，要么放在结尾，要么转义。

排除字符组

纵向模糊匹配某位字符不能是a、b、c
[^abc]表示一个除a、b、c之外的任意一个字符。字符组的第一位放^（脱字符），表示求反的概念。

常见的简写形式

\d就是[0-9]。表示一位数字。digit
\D就是[^0-9]。表示除数字外的任意字符
\w就是[0-9a-zA-Z]。表示数字、大小写字母和下划线。word
\W就是[^0-9a-zA-Z]。非单词字符
\s就是[\t\v\n\r\f]。表示空白符，包括空格、水平制表符、垂直制表符、换行符、回车符、换页符。space
\S就是[^\t\v\n\r\f]。非空白符
.就是[^\n\r\u2028\u2029]。通配符，表示所有任意字符。

匹配任意字符，可以使用[\d\D]、[\w\W]、[\s\S]、[^]中任意一个。

量词

量词也称重复。{m,n}

简写形式

{m,} 表示至少出现m次
{m} 等价于{m,m}，表示出现m次
? 等价于{0,1}，表示出现或不出现
+ 等价于{1,}，表示出现至少一次。
* 等价于{0,}，表示出现任意次，有可能不出现。

贪婪匹配和惰性匹配

var regex = /\d{2,5}/g;
var string = "123 1234 12345 123456";
console.log(string.match(regex));
//[ '123', '1234', '12345', '12345' ]

贪婪匹配，就会尽可能多的匹配。
惰性匹配，就会尽可能少的匹配。

var regex = /\d{2,5}?/g;
var string = "123 1234 12345 123456";
console.log(string.match(regex));
//[ '12', '12', '34', '12', '34', '12', '34', '56' ]

/\d{2,5}?/g 表示2到5次都行，当2个就够的时候，不再往下匹配。

通过在量词后面加?就能实现惰性匹配，所有的惰性匹配情形
- {m,n}?
- {m,}?
- ??
- +?
- *?
.* 是贪婪模式
.*?是惰性模式

多选分支

一个模式可以实现横向和纵向模糊匹配。而多选分支可以支持多个子模式任选其一。
(p1|p2|p3)其中p1、p2和p3是子模式，用|（管道符）分隔，表示其中任何一个。

var regex = /good|nice/g;
var string = "good idea, nice try.";
console.log(string.match(regex));
//[ 'good', 'nice' ]

var regex = /good|goodbye/g;
var string = "goodbye";
console.log( string.match(regex) ); 
// => ["good"]

var regex = /goodbye|good/g;
var string = "goodbye";
console.log( string.match(regex) ); 
// => ["goodbye"]

以上得到的结果各不相同，分支结构也是惰性的，即当前面的匹配好了，后面的不再尝试。

案例分析

匹配`16`进制颜色值

要求匹配

#ffbbad
#Fc01DF
#FFF
#ffE

分析

表示一个16进制字符，可以用字符组[0-9a-fA-F]
其中字符可以出现3或6次，需要是用量词和分支结构
使用分支结构时，需要注意顺序

var regex = /#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})/g;
var string = "#ffbbad #Fc01DF #FFF #ffE";
console.log(string.match(regex));
//[ '#ffbbad', '#Fc01DF', '#FFF', '#ffE' ]

匹配时间

要求匹配

23:59
02:07

分析

共4位数字，第一位数字可以是[0-2]
当第1位是2时，第2位可以是[0-3]，其他情况第2位是[0-9]
第3位数字是[0-5]，第4位是[0-9]

var regex = /^([01][0-9]|[2][0-3]):[0-5][0-9]$/g;

要求匹配7:9，时分前面的0可以省略。

var regex = /^(0?[0-9]|1[0-9]|2[0-3]):(0?[0-9]|[1-5][0-9])$/g;
var string = "7:9";
console.log(regex.test(string));
//true

匹配日期

要求匹配 2017-06-10

分析

年，四位数字即可[0-9]{4}
月，共12个月，分两种情况01、02、...和10、11、12，(0[1-9]|1[0-2])
年，最大31天，可用(0[1-9]|[12][0-9]|3[01])

var regex = /^[0-9]{4}-(0[0-9]|1[0-2])-(0[0-9]|[12][0-9]|3[01])$/g;
console.log(regex.test("2017-10-20"));
//true

window操作系统文件路径

F:\study\javascript\regex\regular expression.pdf
F:\study\javascript\regex\
F:\study\javascript
F:\

分析

整体模式是：盘符：\文件夹\文件夹\文件夹\
其中匹配F:\，需要使用[a-zA-Z]:\\，其中盘符不区分大小写，注意\字符需要转移
文件名或文件夹名，不能包含一些字符字符，此时需要排除字符组[^\\:*<s>|"?\r\n/]来表示合法字符。不能为空名，至少有一个字符，也就是要使用量词+。
- 匹配文件夹\，可用[^\\:*<>|"?\r\n/]+\\
另外文件夹\，可以出现任意次。也就是([^\\:*<>|"?\r\n/]+\\)*。其中括号提供子表达式。
路径的最后一部分可以是文件夹，没有\，因此需要添加([^\\:*<>|"?\r\n/]+)?

var regex = /^[a-zA-Z]:\\([^\\:*<>|"?\r\n/]+\\)*([^\\:*<>|"?\r\n/]+)?$/g;

匹配id

要求从<div id="container" class="main"></div>中提取出id="container"

var regex = /id=".*?"/;
var string = '<div id="container" class="main"></div>';
console.log(string.match(regex)[0]);
//id="container"

位置匹配

在ES5中共有6个锚字符

^$\b\B(?=p)(?!p)

`$`和`^`

^（脱字符）匹配开头，在多行匹配中匹配行开头
$（美元符号）匹配结尾，在多行匹配中匹配结尾

把字符串的开头和结尾用#替换

var result = "hello".replace(/^|$/g, '#');
console.log(result);
//#hello#

多行匹配模式

var result = "I\nlove\njavascript".replace(/^|$/gm, '#');
console.log(result);
//#I#
// #love#
// #javascript#

`\b`和`\B`

\b是单词边界，具体就是\w和\W之间的位置，也包括\w和\W之间的位置，也包括\w和$之间的位置

文件名是[JS] Lesson_01.mp4中的\b

var result = "[JS] Lesson_01.mp4".replace(/\b/g, '#');
console.log(result);
//[#JS#] #Lesson_01#.#mp4#

`(?=p)`和`(?!p)`

(?=p)，其中p是一个子模式，即p前面的位置
(?=l)，表示l字符前面的位置

var result = "hello".replace(/(?=l)/g, '#');
console.log(result);
//he#l#lo

(?!p)是(?=p)的反向操作

var result = "hello".replace(/(?!l)/g, '#');
console.log(result);
//#h#ell#o#

分别是正向先行断言和反向先行断言，具体是(?<=p)和(?<!p)

(?=p)就是p前面的那个位置

位置的特性

var result = /^^hello$$$/.test("hello");
console.log(result); 
// => true

案例

不匹配任何东西的正则

/.^/

数字的千位分隔符表示法

把12345678，变成12,345,678

使用(?=\d{3}$)

var result = "12345678".replace(/(?=\d{3}$)/g, ',');
console.log(result);
//12345,678

逗号出现的位置，要求后面3个数字一组，也就是\d{3}至少出现一次

可以使用量词+

var result = "12345678".replace(/(?=(\d{3})+$)/g, ',');
console.log(result);
//12,345,678

匹配其他案例

匹配位置不是开头(?!^)

var string1 = "12345678";
var string2 = "123456789";
var reg = /(?!^)(?=(\d{3})+$)/g;
var result1 = string1.replace(reg, ',');
console.log(result1);
//12,345,678
var result2 = string2.replace(reg, ',');
console.log(result2);
//123,456,789

验证密码问题

密码长度6-12位，由数字、小写字符和大写字母组成，但必须至少包括2种字符。

简化

不考虑“但至少包括2种字符”这个条件

var reg = /^[0-9A-Za-z]{6,12}$/;

判断是否含有某一种字符

如果要求必须包含数字，可以使用(?=.*[0-9])

var reg = /(?=.*[0-9])^[0-9A-Za-z]{6,12}$/;

同时包含具有两种字符

同时包含数字和小写字母，可以用(?=.*[0-9](?=.*[a-z]))

var reg = /(?=.*[0-9])(?=.*[a-z])^(0-9A-Za-z){6,12}$/;

同时包含数字和小写字母
同时包含数字和大写字母
同时包含小写字母和大写字母
同时包含数字、小写字母和大写字母

var reg = /((?=.*[0-9])(?=.*[a-z])|(?=.*[0-9])(?=.*[A-Z])|(?=.*[a-z])(?=.*[A-Z]))^[0-9A-Za-z]{6,12}$/;

括号的作用

括号提供分组
引用某个分组，有两种情形：在JS中引用，在正则表达式中应用

分组和分支结构

分组

/a+/匹配连续出现的a，要匹配连续出现的ab时，需要使用/(ab)+/
括号提供分组功能，使量词+作用于ab这个整体

var regex = /(ab)+/g;
var string = "ababa abbb ababab";
console.log(string.match(regex));
//[ 'abab', 'ab', 'ababab' ]

分支结构

多选分支结构(p1|p2)中括号的作用是提供了子表达式的所有可能

I love JavaScript
I love Regular Expression

var regex = /^I love (JavaScript|Regular Expression)$/;
console.log( regex.test("I love JavaScript") );
console.log( regex.test("I love Regular Expression") );
// => true
// => true

引用分组

括号的重要作用，可以进行数据提取，以及更强大的替换操作

匹配日期yyyy-mm-dd

提取数据

提取出年、月、日

var regex = /(\d{4})-(\d{2})-(\d{2})/;
var string = "2018-06-18";
console.log(string.match(regex));
//[ '2018-06-18', '2018', '06', '18', index: 0, input: '2018-06-18' ]

match返回的一个数组，第一个元素是整体匹配结果，然后是各个分组（括号）匹配的内容，然后是匹配下标，最后是输入的文本。（正则是否有修饰符g，match返回的数组格式是不一样）

可以使用正则对象的exec方法

可以使用构造函数的全局属性$1至$9来获取

var regex = /(\d{4})-(\d{2})-(\d{2})/;
var string = "2017-06-12";

regex.test(string); // 正则操作即可，例如
//regex.exec(string);
//string.match(regex);

console.log(RegExp.$1); // "2017"
console.log(RegExp.$2); // "06"
console.log(RegExp.$3); // "12"

替换

把yyyy-mm-dd格式，替换成mm/dd/yyyy

var regex = /(\d{4})-(\d{2})-(\d{2})/;
var string = "2017-06-12";
var result = string.replace(regex, "$2/$3/$1");
console.log(result); 
// => "06/12/2017"

其中replace中第二个参数用$1、$2、$3指代相应的分组。等价于var regex=/(\d{4})-(\d{2})-(\d{2})/

反向引用

写一个正则支持匹配以下三种格式：

2016-06-12
2016-06-12
2016.06.12

要求分割符前后一致，使用反向引用

var regex = /\d{4}(-|\/|\.)\d{2}\1\d{2}/;
var string1 = "2017-06-12";
var string2 = "2017/06/12";
var string3 = "2017.06.12";
var string4 = "2016-06/12";
console.log( regex.test(string1) ); // true
console.log( regex.test(string2) ); // true
console.log( regex.test(string3) ); // true
console.log( regex.test(string4) ); // false

\1，表示的引用之前的分组(-|\/|\.)。不管它匹配到什么（比如-），\1都匹配那个同样的具体某个字符
\2和\3分别指代第二个和第三个分组

括号嵌套

以左括号（开括号）为准

var regex = /^((\d)(\d(\d)))\1\2\3\4$/;
var string = "1231231233";
console.log( regex.test(string) ); // true
console.log( RegExp.$1 ); // 123
console.log( RegExp.$2 ); // 1
console.log( RegExp.$3 ); // 23
console.log( RegExp.$4 ); // 3

正则匹配模式

第一个字符是数字，比如说1，
第二个字符是数字，比如说2，
第三个字符是数字，比如说3，
接下来的是1，是第一个分组内容，那么看第一个开括号对应的分组是什么，是123，
接下来的是2，找到第2个开括号，对应的分组，匹配的内容是1，
接下来的是3，找到第3个开括号，对应的分组，匹配的内容是23，
最后的是4，找到第3个开括号，对应的分组，匹配的内容是3。

引用不存在的分组

反向引用，引用前面的分组，在正则里引用了不存在的分组，正则不会报错，只是匹配反向引用的字符本身

非捕获分组

前面出现的分组，都会捕获它们匹配的数据，以便后续引用，因此也称它们是捕获型分组
非捕获分组?:p

var regex = /(?:ab)+/g;
var string = "ababa abbb ababab";
console.log(string.match(regex));
//[ 'abab', 'ab', 'ababab' ]

案例

字符串`trim`方法模拟

trim方法是去掉字符串的开头和结尾的空白符

第一种，匹配到开头和结尾的空白符，然后替换成空白符

function trim(str) {
    return str.replace(/^\s+|\s+$/g, '')
}

第二种，匹配整个字符串，然后用引用来提取出相应的数据

function trim(str) {
    return str.replace(/^\s*(.*?)\s*$/g, "$1");
}

这里使用了惰性匹配*?，不然也会匹配最后一个空格之前的所有空格

将每个单词的首字母转换成大写

function titleize(str) {
    return str.toLowerCase().replace(/(?:^|\s)\w/g, function (c) {
        return c.toUpperCase();
    })
}
console.log(titleize('my name is epeli'));
//My Name Is Epeli

思路是找到每个单词的首字母，这里不适用非捕获匹配也是可以的

驼峰化

function camelize(str) {
    return str.replace(/[-_\s]+(.)?/g, function (match, c) {
        return c ? c.toUpperCase() : '';
    })
}
console.log(camelize('-moz-transform'));
//MozTransform

其中分组(.)表示首字母。单词的界定是，前面的字符可以是多个连字符、下划线以及空白符。
正则后面的？的目的，是为了应对str尾部的字符可能不是单词字符。

中划线化

驼峰化的逆过程

function dasherize(str) {
    return str.replace(/([A-Z])/g,'-$1').replace(/[-_\s]+/g,'-').toLowerCase();
}
console.log(dasherize('MozTransform'));
//-moz-transform

`html`转义和反转义

匹配成对标签

要求匹配

<title>regular expression</title>
<p>laoyao bye bye</p>

不匹配

<title>wrong!</p>

匹配一个开标签，使用正则<[^>]+>
匹配一个闭标签，使用<\/[^>]+>

要求匹配成对标签，需要使用反向引用

var regex = /<([^>]+)>[\d\D]*<\/\1>/;
var string1 = "<title>regular expression</title>";
var string2 = "<p>laoyao bye bye</p>";
var string3 = "<title>wrong!</p>";
console.log(regex.test(string1)); // true
console.log(regex.test(string2)); // true
console.log(regex.test(string3)); // false

其中开标签<[^>]+>改成<([^>]+)>，使用括号的目的是为了后面使用反向引用，而提供分组
闭标签使用了反向引用<\/\1>
[\d\D]这个字符是数字或不是数字，也就是匹配任意字符

正则表达式回溯法

没有回溯的匹配

当目标字符串是abbbc时，就没有所谓的“回溯”。

有回溯的匹配

如果目标字符串是abbc，中间就有回溯

常见的回溯形式

回溯法也称试探法，基本思想：从问题的某一种状态（初始状态）出发，搜索从这种状态出发所能达到的所有“状态”，当一条路走到“尽头”的时候，再后退一步或若干步，从另一种可能状态出发，继续搜索，直到所有的路径（状态）都试探过。这种不断前进、不断回溯寻找解的方法，称作“回溯法”。
本质上就是深度优先搜索算法。其中退到之前的某一步这个过程，成为“回溯”。

正则表达式产生回溯的地方

贪婪量词

var string = "12345";
var regex = /(\d{1,3})(\d{1,3})/;
console.log(string.match(regex));
//[ '12345', '123', '45', index: 0, input: '12345' ]

前面的\d{1,3}匹配的是123，后面的\d{1,3}匹配的是45

惰性量词

惰性量词就是在贪婪量词后面加个问好。表示尽可能少的匹配。

var string = "12345";
var regex = /(\d{1,3}?)(\d{1,3})/;
console.log( string.match(regex) );
// => ["1234", "1", "234", index: 0, input: "12345"]

其中\d{1,3}?只匹配到一个字符1，而后面的\d{1,3}匹配了234
虽然惰性量词不贪婪，但也会有回溯现象。

分支结构

分支也是惰性的，比如/can|candy/，去匹配字符串candy，得到的结果是can，因为分支会一个一个尝试，如果前面的满足，后面就不会再试验。
分支结构，可能前面的子模式会形成了局部匹配，如果接下来表达式整体不匹配，仍会继续尝试剩下的分支。

正则表达式的拆分

结构和操作符

在正则表达式中，操作符都体现在结构中，即由特殊字符和匹配字符所代表的一个特殊整体。

JS正则表达式中，都有哪些结构？

字符字面量、字符组、量词、锚字符、分组、选择分支、反向引用

具体含义

字面量，匹配一个具体字符，包括不用转义的和需要转义的。
- 比如a匹配字符a，\n匹配换行符，\.匹配小数点
字符组，匹配一个字符，可以是多种可能之一，
- 比如[0-9]，表示匹配一个数字，\d是简写形式。
- 另外还有反义字符组，表示可以是除了特定字符之外任何一个字符，比如[^0-9]表示一个非数字字符，也有\D的简写形式
量词，表示一个字符连续出现，比如a{1,3}表示a字符连续出现3次。
- 常见简写形式，a+表示a字符连续出现至少一次
锚点，匹配一个位置，而不是字符。
- 比如^匹配字符串的开头，
- 比如\b匹配单词边界
- 比如(?=\d)表示数字前面的位置
分组，用括号表示一个整体，
- 比如(ab)+表示ab两个字符连续出现多次，也可以使用非捕获分组(?:ab)+
分支，多个子表达式多选一
- 比如abc|bcd表示式匹配abc或bcd字符子串
反向引用，比如\2表示引用第2个分组

其中涉及到的操作符有

转义符 \
括号和方括号 (...)、(?:...)、(?=...)、(?!...)、[...]
量词限定符 {m}、{m,n}、{m,}、?、*、+
位置和序列 ^、$、\元字符、一般字符
管道符 |

操作符的优先级从上至下，由高到低

/ab?(c|de*)+|fg/

由于括号的存在，(c|de*)是一个整体结构
在(c|de*)中注意其中的量词，因此e是一个整体结构
因为分支结构|优先级最低，因此c是一个整体，而de*是另一个整体
同理，整个正则分成了a、b?、(...)+、f、g。而由于分支的原因，又可以分成ab?(c|de*)+和fg两部分

注意要点

匹配字符串整体问题

要匹配整个字符串，在正则前后中加上锚字符^和$

量词连缀问题

每个字符为a、b、c任选其一
字符串的长度是3的倍数

/([abc]{3})/

元字符转义问题

元字符，就是正则中特殊含义的字符
所有结构里，用到的元字符：
- ^、$、.、*、+、?、|、|、/、()、[]、{}、=、!、:、-、,

当匹配上面的字符本身时，可以一律转义：

var string = "^$.*+?|\\/[]{}=!:-,";
var regex = /\^\$\.\*\+\?\|\\\/\[\]\{\}\=\!\:\-\,/;
console.log(regex.test(string));
// => true

其中string中的\字符也要转义
另外在string中也可以把每个字符转义，转义后的结果仍然是自身

字符组中的元字符

跟字符组相关的元字符有[]`、^、-，需要在会引起歧义的地方进行转义。例如开头的^`必须转义，不然会把整个字符组，看成反义字符组。

var string = "^$.*+?|\\/[]{}=!:-,";
var regex = /[\^$.*+?|\\/\[\]{}=!:\-,]/g;
console.log( string.match(regex) );

案例分析

身份证

/^(\d{15}|\d{17}[\dxX])$/

因为|的优先级最低，所以正则分成了两部分\d{15}和\d{17}[\dxX]

\d{15}表示15位连续数字
\d{17}[\dxX]表示17位连续数字，最后一位可以是数字或大小写字母x

IPV4地址

(0{0,2}\d|0?\d{2}|1\d{2}|2[0-4]\d|25[0-5])(0{0,2}\d|0?\d{2}|1\d{2}|2[0-4]\d|25[0-5])

它是一个多选结构，分成5部分

0{0-2}\d，匹配一位数，包括0补齐。比如9、09、009
0?\d{2}，匹配两位数，包括0补齐，也包括一位数
1\d{2}，匹配100到199
2[0-4]\d，匹配200-249
25[0-5]，匹配250-255

正则表达式编程

四种操作

验证

验证时正则表达式最直接的应用，比如表单验证

判断一个字符串中是否有数字

使用search

var regex = /\d/;
var string = "abc123";
console.log(!!~string.search(regex));
//true

使用test

var regex = /\d/;
var string = "abc123";
console.log( regex.test(string) );
// => true

使用match

var regex = /\d/;
var string = "abc123";
console.log( !!string.match(regex) );
// => true

使用exec

var regex = /\d/;
var string = "abc123";
console.log( !!regex.exec(string) );
// => true

其中，最常用的是test

切分

切分，就是把目标字符串切成段，例如JS中的split
- 比如目标字符串html,css,javascript，按逗号来切分

var regex = /,/;
var string = "html,css,javascript";
console.log(string.split(regex));
//[ 'html', 'css', 'javascript' ]

日期格式

2018/06/20
2018.06.20
2018-06-20

可以使用split切出年月日

var regex = /\D/;
console.log("2018/06/20".split(regex));
console.log("2018.06.20".split(regex));
console.log("2018-06-20".split(regex));
// [ '2018', '06', '20' ]
// [ '2018', '06', '20' ]
// [ '2018', '06', '20' ]

提取

此时正则通常要使用分组引用（分组捕获）功能

match

var regex = /^(\d{4})\D(\d{2})\D(\d{2})$/;
var string = "2018-06-20";
console.log(string.match(regex));
//[ '2018-06-20', '2018', '06', '20', index: 0, input: '2018-06-20' ]

exec

var regex = /^(\d{4})\D(\d{2})\D(\d{2})$/;
var string = "2018-06-20";
console.log(regex.exec(string));
//[ '2018-06-20', '2018', '06', '20', index: 0, input: '2018-06-20' ]

test

var regex = /^(\d{4})\D(\d{2})\D(\d{2})$/;
var string = "2018-06-20";
regex.test(string);
console.log(RegExp.$1, RegExp.$2, RegExp.$3);
//2018 06 20

search

var regex = /^(\d{4})\D(\d{2})\D(\d{2})$/;
var string = "2018-06-20";
string.search(regex);
console.log(RegExp.$1, RegExp.$2, RegExp.$3);
//2018 06 20

replace

var regex = /^(\d{4})\D(\d{2})\D(\d{2})$/;
var string = "2018-06-20";
var date = [];
string.replace(regex, function (match, year, month, day) {
    date.push(year, month, day);
});
console.log(date);
//[ '2018', '06', '20' ]

其中最常用的是match

替换

把日期格式，从yyyy-mm-dd替换成yyyy/mm/dd：

var string = "2018-06-20";
var today = new Date(string.replace(/-/g, "/"));
console.log(today);
//2018-06-19T16:00:00.000Z

用于正则操作的方法，共有6个，字符串实例4个，正则实例2个

string#search
string#split
string#match
string#replace
RegExp#test
RegExp#exec

search和match的参数问题

字符串实例的4个方法参数都支持正则和字符串
但search和match把字符串转换为正则

var string = "2018.06.20";

console.log(string.search("."));//0
//需要修改成下列形式之一
console.log(string.search("\\."));//4
console.log(string.search(/\./));//4

console.log(string.match("."));
//[ '2', index: 0, input: '2018.06.20' ]
//需要修改成下列形式之一
console.log(string.match("\\."));
//[ '.', index: 4, input: '2018.06.20' ]
console.log(string.match(/\./));
//[ '.', index: 4, input: '2018.06.20' ]

console.log(string.split("."));
//[ '2018', '06', '20' ]

console.log(string.replace(".", "/"));
//2018/06.20

match返回结果的格式问题

match返回结果的格式，跟正则对象是否有修饰符g有关

var string = "2018.06.20";
var regex1=/\b(\d+)\b/;
var regex2=/\b(\d+)\b/g;
console.log(string.match(regex1));
//[ '2018', '2018', index: 0, input: '2018.06.20' ]
console.log(string.match(regex2));
//[ '2018', '06', '20' ]

没有g，返回的是标准匹配格式，数组的第一个元素时整体匹配的内容，接下来是分组捕获的内容，然后是整体匹配的第一个下标，最后的输入的目标字符串
有g，返回的是所有匹配的内容
当没有匹配时，不管有没有g都返回null

exec比match更强大

当正则没有g时，使用match返回的信息比较多。但是有g后，就没有关键信息index
而exec方法就能解决这个问题，它能接着上一次匹配后继续匹配

var string = "2018.06.20";
var regex = /\b(\d+)\b/g;
console.log(regex.exec(string));
//[ '2018', '2018', index: 0, input: '2018.06.20' ]
console.log(regex.lastIndex);//4
console.log(regex.exec(string));
// [ '06', '06', index: 5, input: '2018.06.20' ]
console.log(regex.lastIndex);//7
console.log(regex.exec(string));
//[ '20', '20', index: 8, input: '2018.06.20' ]
console.log(regex.lastIndex);//10
console.log(regex.exec(string));//null
console.log(regex.lastIndex);//0

test整体匹配时需要使用^和$

test是看目标字符串中是否有子串匹配正则，即有部分匹配即可。

要整体匹配，正则前后需要添加开头和结尾

console.log( /123/.test("a123b") );
// => true
console.log( /^123$/.test("a123b") );
// => false
console.log( /^123$/.test("123") );
// => true

split相关注意事项

第一，它可以有第二个参数，表示结果数组的最大长度

var string = "html,css,javascript";
console.log( string.split(/,/, 2) );
// =>["html", "css"]

第二，正则使用分组时，结果数组中是包含分隔符的

var string = "html,css,javascript";
console.log( string.split(/(,)/) );
// =>["html", ",", "css", ",", "javascript"]

replace是很强大的

replace有两种使用形式，它的第二个参数，可以是字符串，也可以是函数。

当第二个参数是字符串时，如下的字符有特殊的含义：

$1,$2,...,$99 匹配第1~99个分组里捕获的文本
$& 匹配到的子串文本
$` 匹配到的子串的左边文本
$' 匹配到的子串的右边文本
$$ 美元符号

例如，把"2,3,5"，变成"5=2+3"：

var result = "2,3,5".replace(/(\d+),(\d+),(\d+)/, "$3=$1+$2");
console.log(result);
// => "5=2+3"

当第二个参数是函数时，该回调函数的参数具体：

"1234 2345 3456".replace(/(\d)\d{2}(\d)/g, function(match, $1, $2, index, input) {
    console.log([match, $1, $2, index, input]);
});
// => ["1234", "1", "4", 0, "1234 2345 3456"]
// => ["2345", "2", "5", 5, "1234 2345 3456"]
// => ["3456", "3", "6", 10, "1234 2345 3456"]

修饰符

g 全局匹配，即找到所有匹配的，单词是global
i 忽略字母大小写，单词ingoreCase
m 多行匹配，只影响^和$，二者变成行的概念，即行开头和行结尾。单词是multiline

正则表达式

正则表达式

字符匹配

两种模糊匹配

横向模糊匹配

纵向模糊匹配

字符组

范围表示法

排除字符组

常见的简写形式

量词

简写形式

贪婪匹配和惰性匹配

多选分支

案例分析

匹配16进制颜色值

匹配时间

匹配日期

window操作系统文件路径

匹配id

位置匹配

$和^

\b和\B

(?=p)和(?!p)

位置的特性

案例

不匹配任何东西的正则

数字的千位分隔符表示法

匹配其他案例

验证密码问题

括号的作用

分组和分支结构

分组

分支结构

引用分组

反向引用

非捕获分组

案例

字符串trim方法模拟

将每个单词的首字母转换成大写

驼峰化

中划线化

html转义和反转义

匹配成对标签

正则表达式回溯法

没有回溯的匹配

有回溯的匹配

常见的回溯形式

贪婪量词

惰性量词

分支结构

正则表达式的拆分

结构和操作符

注意要点

案例分析

正则表达式编程

四种操作

验证

切分

提取

替换

寒青

引用和评论

我的技能树

腾讯新闻中心首页改版啦

网页设计的垂直居中

CSS团队协作规范

前端如何入门 Go 语言

100个React最佳实践小技巧

不使用 JS 纯 CSS 获取屏幕宽高

匹配`16`进制颜色值

`$`和`^`

`\b`和`\B`

`(?=p)`和`(?!p)`

字符串`trim`方法模拟

`html`转义和反转义