前端知识分类收纳(1)-正则表达式

最近迷上了收纳，买了好多的箱子，开始整理屋里的东西。好友甚至借给我一本日本作家的关于收纳的书籍，又摩拳擦掌地要周末来帮我收拾～～。好吧，那就整理起来吧！
回头再看看从事的前端工作，都说前端的知识点大而杂，那这么多的知识点是不是也可以收纳整理一下呢？在头脑中逐步形成一个有战斗力的兵团，当碰到敌军进犯时，都争先恐后的跳出来请战，而我熟悉他们的每一个优点，更能审时度势，运筹帷幄！多说无益，开始行动吧！
第一个收纳箱从“正则表达式”开始
在网上看看一个非常详细的树形图介绍，也引用下来。原图片的地址如下：https://files.jb51.net/file_i...

---

基本内容

---

定义：
（1） 构造函数方式：new RegExp('abc', 'gi')
（2） 字面量方式： var reg = /abc/gi

---

常用的元字符:
.    匹配除换行符以外的任意字符
\w    匹配字母、数字、下划线或汉字
\W    匹配任意不是字母，数字，下划线，汉字的字符
\s    匹配任意的空白符
\S    匹配任意不是空白符的字符
\d    匹配数字
\D    匹配任意非数字的字符
\b    匹配单词的开始或结束
\B    匹配不是单词开头或结束的位置
^    匹配字符串的开始
$    匹配字符串的结束

---

重复的限定符：
*重复零次或更多次
+重复一次或更多次
?    重复零次或一次
{n}    重复n次
{n,}    重复n次或更多次
{n,m}    重复n到m次

---

[aeiou]    匹配字符集    
|    分支条件

()  分组    
(exp)    匹配exp,并捕获文本到自动命名的组里
(?<name>exp)    匹配exp,并捕获文本到名称为name的组里，也可以写成(?'name'exp)
(?:exp)    匹配exp,不捕获匹配的文本，也不给此分组分配组号
(?=exp)    匹配exp前面的位置，
(?<=exp)    匹配exp后面的位置
(?!exp)    匹配后面跟的不是exp的位置
(?<!exp)    匹配前面不是exp的位置
(?#comment)    这种类型的分组不对正则表达式的处理产生任何影响，用于提供注释让人阅读

---

3个标识(flags):
g  全局模式
i  不区分大小写
m  多行模式

---

捕获分组: 
后向引用：重复搜索前面某个分组匹配的文本。
零宽度断言: 查找某些内容之前和之后的东西，也就是说指定一个位置，这个位置应该满足一定条件(断言)
懒惰和贪婪：贪婪-匹配尽量多的字符。懒惰-加?

---

常用方法：
正则自身的方法：
（1）test: 匹配返回true，否则返回false
var reg=/boy(s)?\s+and\s+girl(s)?/gi;
console.log(reg.test('boy    and   girl'));

（2）exec:
该方法属于一个比较复杂的方法，它接受一个字符串，返回的是一个数组，数组中第0个元素是匹配的子字符串，第二个元素是正则中的第一个子分组匹配的结果（如果有子分组，即正则中存在用圆括号括起来的分组），第三个是正则中第二个子分组匹配的结果（如果有第二个子分组）...以此类推，如果没有正则子分组，那么该数组长度仅仅为1，就是匹配到的那个子字符串。同时，返回的这个数组同时还是一个对象，它拥有两个属性，分别为index表示当前匹配到的子字符串所处的位置，input属性表示被匹配的原始字符串。最后，该方法中的正则对象如果不是全局匹配，即没有g修饰符，则每次调用只会从字符串开头处匹配第一个结果，且每次调用结果都是一样的。
var reg=/(\w)l(\w)/g;
var str="hello world hello 123 hello programmer hello test";
var arr=reg.exec(str);

 js方法：
（3）match: 全局下把全部的搜索以数组方式返回。
（4）search:返回第一次匹配的index, 不匹配则返回-1

var str="hello world";
console.log(str.search(/o/g));
（5）replace
str.replace(/hello/g,'hi')
（6）split：当拆分规则不统一时使用
var str="how|old*are    you";
var arr=str.split(/\||\*|\s+/);

---

ES6扩展

实例

（1）只输入中文
（2）只数组中文和英文
（3）邮箱验证
（4）IP验证