正则及表单验证
回顾：
复习字符的操作：
search 查找 返回下标
subsring 方法用于提取字符串中介于两个指定下标之间的字符。开始和结束 ，不包括结束位置
charAt 获取某个字符串 输入下标
split 分割字符串，获得数组
replace 替换
如：从杂乱的字符串中找数字
var str = "asd68asd687as6da78sd123123zcacas";
使用正则的方式
var arr = str.match(/\d+/g);
就可以完成功能
一、正则的概念
1、 正则诞生的目的是什么？
就是为了做表单验证
在JS未出现以前，表单的信息验证需要传输给后台，让后台做数据验证处理之后，再返回给前端页面处理的结果。在带宽有限的情况下，整个验证过程非常复杂，且耗时。
在使用JS做验证的过程中，一个简单的验证规则的实现非常的麻烦。
2、什么正则？
正则表达式（regular expression）是一个描述字符规则的对象。可以用来检查一个字符串是否含有某个字符，将匹配的字符做替换或者从某个字符串中取出某个条件的子串等
正则表达式：
正则表达式其实就是一种规则，其实把正则称作规则表达式更为恰当。正则的语法基于一种古老的perl语言
3、为什么要使用正则?
前端往往有大量的表单数据校验工作，采用正则表达式会使得数据校验的工作量大大减轻。常用效果：邮箱，手机号，身份证号等
二、正则的创建
正则的创建方式：
1.构造函数方式
var reg1 = new RegExp("a");
var str = "adassdfsd";
console.log(str.match(reg1)) //输出匹配a的字符
2.字面量方式，古老的perl语言风格
var reg2 = /a/;
console.log(str2.match(reg2)); //输出匹配a的字符
/ / 是正则表达式的标识符
" " 是字符串的标识符
[ ] 是数组的标识符
{ } 是对象的标识符
正则中的修饰符，写在正则表达式后面／的后面：
g表示全局匹配，查找所有
i表示忽略大小写
先看各种方法有什么不同？
字符串方法
match 获取匹配的项目 返回数组 匹配正则
search 字符串搜索
replace 替换
正则方法：
test 方法用于检测一个字符串是否匹配某个模式. 返回true和false
exec()找到了返回数组，找不到反回null
三、正则与字符串配合
search 字符串搜索
返回出现的位置、忽略大小写 i
例子：判断浏览器的类型
match 获取匹配的项目 返回数组
量词： +
量词变化： \d 、\d\d 和\d+
例子：找出所有的数字
replace 替换所有匹配 返回替换后的字符串
例子：敏感词过滤
正则方式 test() 方法用于检测一个字符串是否匹配某个模式. 返回true和false
比如检测str中有没有box；
var str = "This is a Box!";
var res = /box/;
console.log(res.test(str));
修饰符：
i 忽略大小写
g 全局匹配
四、字符类
任意字符
[abc] 例子：o[usb]t ==> obt 、ost、 obt
范围
[a-z]、[0-9] 例子： id[0-9] id0 、 id1...
| 或，类似于js中的 ||
var reg = /abc|bbc|cbc|dbc/g
console.log(str.match(reg)); //打印字符串中的abc，bbc，cbc，dbc
var reg = /[a-c]bc/g
排除
[^a] 表示排除a
例子：[^0-9]
组合
[a-z0-9A-Z]
五、表达式：
[abc] 查找方括号之间的任何字符。
[0-9] 查找任何从 0 至 9 的数字。
[a-z] 查找任何从小写 a 到小写 z 的字符。
[A-Z] 查找任何从大写 A 到大写 Z 的字符。
[A-z] 查找任何从大写 A 到小写 z 的字符。
六、元字符
转义字符：
\d —— [0-9] 数字
\w —— [a-z0-9_] 数字，字母，下划线
\s —— 空白字符
\b -- 匹配单词边界
\D —— [^0-9] 非数字
\W —— [^a-z0-9_] 非数字，字母，下划线
\S —— 非空白字符
. 表示任意字符
七、量词
也叫限定符，可以指定正则表达式的一个给定组，必须要出现多少次才能满足匹配
通过量词可以设置一个内容出现的次数。注意点：量词只对它前边的一个内容起作用。 都是必须连续出现
{n}：匹配前一个字符正好出现n次
{n,}：匹配前一个字符出现n次以上，没有限制
{n,m}：匹配一个字符出现n到m次
*表示允许的次数是0 至 正无穷次，有没有都行
+表示允许的次数是1 至 正无穷次，至少有一个
? 表示允许的次数是0至1，最多出现1次
()表示一组
^开始 $结束
八、练习
1、qq号验证规则:
var reg = /[1-9]\d{4,10}/
2、复杂邮箱的规则：英文数字下划线@一串英文或数子.一串英文
var reg = /\w+@[a-z0-9]+\.[a-z]+/i
想要校验怎么办？在正则转义字符前加上\
3、删除多余空格
str.replace(/\s+/g,'');
删除首尾空格
str.replace(/^\s+/,'');
str.replace(/\s+$/,'');
4、检查邮政编码 共 6 位数字，第一位不能为 0
/^[1-9]\d{5}$/
作业：
只能用数字开头，长度在6–18位之间 /^\d.{5,17}$/
以字母开头，数字结尾，中间任意一个字符 /1.\d$/i
密码不能少于6位的字符 /^.{6,}$/
以010开头的座机号(后面是8位数字) /^010\d{8}$/
手机号以13开头，以8结尾 /^13\d{8}8$/
九、常用正则表达式
-
a-z ↩︎