第九周
正则表达式
-
什么是正则表达式
- 描述字符串的 " 构成模式" , 检查字符串是否符合预定的格式要求
- 大概样貌 : var regexp = /^m\d\d\dn$/ 下面细节
-
正则表达式的基本使用
-
正则表达式的创建
- var regexp = / 内容 /
- new RegExp( ' 内容 ' )
- typeof reg // object
-
元字符
-
一位指定类型的字符
-
元字符 \d 一个数字 \D 一个非数字 \w 一个字符 ( 数字/ 字母/ 下划线 ) \W 一个非字符 \s 一个空白, 包括空格 制表符 换行符 . 任意字符 ^ $ 开头 结尾 -
例子:
-
某快递公司运单号形式是这样的 : 123-4567-890 , 请使用正则表达式检查某字符串是否符合格式
-
某产品验证密钥形式是这样的 : □□□-□□□□-□□□ , 其中 □ 表示字母数字或下划线 , 请使用正则表达式检查某字符串是否符合格式
-
某产品批号 : 123.45^67#89
-
var regexp1 = /^\d\d\d-\d\d\d\d-\d\d\d$/; var regexp2 = /^\w\w\w-\w\w\w\w-\w\w\w$/; var regexp3 = /^\d\d\d\.\d\d\^\d\d\#\d\d$/; // 注意这里的# 加不加\ 一样 -
注意 : \ 的本意需要两个 \
-
-
-
方括号表示法
-
创建一个字符集合，匹配方括号中的任意一个
-
例子：某校学号规定，第一位是字母，b表示本科生，y表示研究生，后面是7位数字，请使用正则
-
var regexp1 = /^[by]\d{7}$/ -
其他用法： 短横 - 表示范围 ^ 表示取反
-
元字符 等价的方括号表示法 \d [0-9] \D [^0-9] \w [a-zA-Z0-9_] \W [^a-zA-Z0-9_] -
题目1：验证字符串是否是5位字母，大小写均可
-
题目2：验证字符串是否是5位字母，且仅有小写字母，点构成
-
题目3：验证字符串是否是4位小写字母，且最后一位不能是m
-
var regexp1 = /^[a-zA-Z]{5}$/ var regexp2 = /^[a-z\.]{5}$/ var regexp3 = /^[a-z]{3}[a-ln-z]$/
-
-
量词
-
量词 含义 * 匹配前一个表达式0 次或n 次，等价 + 匹配前一个表达式1 次或n 次，等价 ？ 匹配前一个表达式0 次或1 次，等价 前一个字符刚好出现n 次 前一个字符至少出现n 次 前一个字符至少n 次，至多m 次 -
题目1：验证字符串是否符合手机号码规则，11 位数字，并且以1 开头
-
题目2：验证：以字母开头，中间是任意位数字（最少一位），并以字母结尾
-
题目3：验证某字符串是否符合网址规则，以www. 开头，中间是任意位的字符（字母数字下划线），最后以 .com 或者 .com.cn 结尾
-
var regexp1 = /^1\d{10}$/ var regexp2 = /^[a-zA-Z]\d+[a-zA-Z]$/ var regexp3 = /^www\.\w+\.com(\.cn)?$/
-
-
修饰符
- i ：不区分大小写搜索
- g ： 全局搜索
- 使用：
- var re = /m/gi
- var re = new RegExp( ' m ' , 'gi')
-
-
正则表达式和字符串
-
正则表达式的相关方法
-
test() 测试字符串是否匹配正则，返回布尔
-
exec() 根据正则，在字符串中查找，返回结果数组或null
-
// 注意这里是，全局搜索 var str = 'abc123def456ghi789'; var re = /\d+/g; var result1 = re.exec(str); var result2 = re.exec(str); var result3 = re.exec(str); var result4 = re.exec(str); var result5 = re.exec(str); console.log(result1); console.log(result2); console.log(result3); console.log(result4); console.log(result5); // 结果数组： （循环找） // ["123", index: 3, input: "abc123def456ghi789", groups: undefined] // ["456", index: 9, input: "abc123def456ghi789", groups: undefined] // ["789", index: 15, input: "abc123def456ghi789", groups: undefined] // null // ["123", index: 3, input: "abc123def456ghi789", groups: undefined] // 换一个写法 var str = 'abc123def456ghi789'; var re = /\d+/g; var result; while(result = re.exec(str)){ console.log(result); } // 注意，赋值语句的返回值是等号右边的值 -
没有 g 全局搜索，一直返回第一个
-
-
-
字符串的相关方法
-
方法 简介 search() 在字符串中根据正则进行查找匹配，返回首次匹配到的索引，找不到返回 -1 match() 在字符串中根据正则进行查找匹配，返回一个数组，找不到返回null replace() 使用替换字符串替换掉匹配到的子字符串，可以使用正则 split() 分隔字符串为数组，可以使用正则 -
var str = "abc123def4567ghi890"; console.log(str.search(/\d+/g)); // 3 // search 只能找到第一个的索引，没有那么强大 console.log(str.match(/\d+/g)); // ['123', '4567', '890'] // match 返回所有匹配的结果 console.log(str.match(/\d+/)); console.log(str.match(/\d+/)); // ['123', index: 3, input: 'abc123def4567ghi890', groups: undefined] // 不加 全局搜索 的match 每次都返回第一个的详细数组 console.log(str.replace(/[a-z]+/g, "*")); // *123*4567*890 console.log(str.split(/\d+/)); console.log(str.split(/\d+/g)); // ['abc', 'def', 'ghi', ''] // split 有没有全局搜索都一样
-
-
-
正则表达式的应用
- 表单验证
Other
-
Banner轮播图
-
if(i == idx % 5) // 0、1、2、3、4 % 5 的结果都是它们本身，而5 % 5为 0
-
-
返回顶部动画
- 固定定位元素
-
垂直菜单