1. 正则表达式
正则表达式 (regular expression) 是一个描述字符规则的对象。如:只能出现字母,只能出现数字,前三个必须是数字等。
前端往往有大量的表单数据校验的工作,采用正则表达式会使得数据校验的工作量大大减轻,如邮箱验证,手机号码,等等。比起用字符串的函数来判断,更简单易用。
正则表达式的组成:普通字符 或者 特殊字符。
定义:
(1)字面量
var reg = /普通字符或者特殊字符/【修饰符】
var reg = /a/;//至少包含一个a
console.log(reg.test('ab'));//true
(2)构造方法
var reg = new RegExp("普通字符或者特殊字符",【修饰符】);
规则:
- 普通字符:看起来是啥就是啥;
特殊字符:具有特殊含义的字符 ;
- a.单个字符
^:正则开始
-
$ : 正则结束
- ^$同时存在代表只能
- . : 元字符, 表示任意一个字符
反斜杠: 表示转义字符 反斜杠.表示.
- 转义字符:对于没有超能力的字符,赋予能力
- 对于有超能力的字符,取消能力
- +: 表示其前面紧挨着的字符至少出现1次 等价{1,}
- 星号:表示其前面出现的字符至少出现过0次 等价{0,}
- ?: 表示其前面出现的字符至少出现过0次,至多1次 等价{0,1}
- | : 表示或者
b.各种括号
{m,n}表示括号前面紧挨着的字符至少出现m个,至多出现n个
- 以b开头 至少3个a 至多5个a /^ba{3,5}&/
- {m}表示括号前面紧挨着的字符只能出现m个
- {m,}表示括号前面紧挨着的字符至少出现m个
- [] 表示括号内的任意一个字符
- [a-z]表示任意一个小写字母 [a-zA-Z0-9]
1表示非括号内的任意一个字符
- ()一般与或连用 表示优先级
- [u4e00-u9fa5] 任意一个中文字符
c.组合字符
- d: 0-9之间的任意一个数字 d只占一个位置
- D: 除了d
- w: 数字,字母 ,下划线 0-9 a-z A-Z _
- W: 除了w
- s: 空格或者空白等
- S: 除了s
注意:
- 转义字符:对于没有超能力的字符,赋予能力;对于有超能力的字符,取消能力;
- [ ]另一种或 内部的内容被去掉超能力;
表单验证
- action:提交的服务器文件
method:提交的方式
- get 默认为get 效率高 安全性低 五菱宏光
- post 效率低 安全性高 武装押运
- onsubmit作为submit按钮的提交事件,返回值为布尔,决定是否提交数据。true为提交 false为不提交。
- 焦点验证: onblur 失去焦点
正则中的相关方法和属性
方法:
test()
- 检验一个字符串是否符合某一个正则规范,如果符合返回true,否则返回false
- 用法: reg.test(str)
exec()
- 根据正则表达式查找,结果满足,会返回一个长度为1的数组(数组只有一个值)
- reg.exec(str)
- g全局属性
var reg = /\d/g;
var arr = reg.exec('1a2b3c')
console.log(arr[0]);//1
arr = reg.exec('1a2b3c')
console.log(arr[0]);//2 全局属性g
正则中相关字符串的方法:
search方法
- 返回与正则表达式查找内容匹配的第一个子字符串的位置
- 用法: str.search(reg)
- i 忽略字母大小写
var str = "wo shi ge bi de lao wang";
var reg1 =/sh/;
console.log(str.search(reg1));//3
var reg2 = /GE/i;//i忽略大小写
console.log(str.search(reg2));//7
match 方法
- 使用正则表达式模式对字符串执行查找,并将包含查找的结果作为数组返回。
- 用法:str.match(rgExp)
var reg = /\d+/g;
var str = "123a4356a987";
console.log(str.match(reg)[0]);//123
console.log(str.match(reg)[1]);//4356
console.log(str.match(reg)[2]);//987
replace 方法
- 返回根据正则表达式进行文字替换后的字符串的复制。
- 用法:stringObj.replace(rgExp,replaceText)
var reg = /laowang/g;
var str = "laowang的隔壁也住着laowang";
console.log(str.replace(reg,"dahuang"));//dahuang的隔壁也住着dahuang