正则表达式
创建
创建正则表达式的方式
-
字面量创建正则表达式 =>没有办法操作变量
- 字面量创建的正则表达式需要采用变量时需要使用eval()方法将字符串变为js语句
let str = 'regexp' let as = 'e' console.log(eval(`/${as}/`).text(str));
-
使用对象创建正则表达式
let str = 'regexp' let reg = new RegExp('e','g') // 对象创建的正则表达式不需要写/ /转义符,并且可以直接使用变量 reg.test(str)
使用对象创建的正则表达式的一个小demo
<div class='text'> this is a text !<div> <script> let key = prompt('请输入要匹配的字符') let reg = new RegExp(key, 'g') let text = document.querySelector('.text') text.innerHTML = text.innerHTML.replace(reg, search => { return `<span style='color:red'>${search}</span>` }) </script>
html dom prompt() 方法
prompt(text,defaultText)
参数 描述 text 可选。对话框中要显示的提示文本。 defaultText 可选。默认的输入文本。
选择符的使用
let tel = '010-1111111'
console.log(/010\-\d{7,8}|020\-\d{7,8}/.test(tel))
// 原子组
console.log(/(010|020)\-\d{7,8}/.test(tel))
原子表和原子组
[] ()
原子组[123456]
表示任意匹配其中一个
原子表(12|34)
表示匹配选择符两边的任意一组
let reg = /[123456]/
let reg1 = /(12|34)/
let str ='1241256'
str.match(reg) ---> 1
str.match(reg1) ---> 12 12
转义符’’
let price = 12.34
// 这里需要将.和d转义所以用到了'\'
consloe.log(/\d+\.\d+/.test(price))
// 在对象法创建的正则中需要用双斜杠转义,因为'/d'==='d'
let reg = new RegExp('\\d+\\.\\d+')
let link = 'https://www.baidu.com'
console.log(/https?:\/\/\w+\.\w+\.\w+/.test(link))
// 这时的匹配还不完整,需要完整匹配需要下一章字符边界约束的知识
字符边界约束
^起始符 $结束符
还是上面的例子 price应该为全数字并且小数点之后最多两位
let price = 12.56
console.log(/^\d+\.\d{2}$/.test(price))
空白元字符
let hd = `张三:010-99999999,李四:010-88888888`;
console.log(hd.match(/[^-\d:,\s]+/g));
// \s 匹配空白元字符 \S匹配非空白字符
// 在原子组中[^]表示除了某些后边匹配到的字符剩下的字符
// 例如[^\d\s-:,]表示除了 数字 空白符 - : ,字符剩下的字符
w和W
\w匹配数字字母下划线
let email = `1471062948@qq.com`
console.log(email.match(/^\w+@\w+.\w+$/))
\W匹配 除了 数字字母下划线
点元字符
\d 数字0-9 \w 数字字母下划线 \s 空白符 . 除了换行符
如果想要单独匹配一个. 就需要用转义符来转义.
匹配所有字符
[\w\W] [\d\D] [\s\S]
模式修正符
let str = 'searchText'
console.log(str.match(/t/gi))
// 这样可以匹配到两个t 一个大写一个小写
console.log(str.replace(/t/gi, '@'))
// 这样可以把匹配到的字符全部替换成想要的字符
m多行匹配实例
let books = `
#1 《三国演义》, 200元 #
#2 《红楼梦》, 300元 #
#3 www.baidu.com #
#4 《西游记》, 600元 #
`;
// 有这样一组数据,我们想把它格式化成如下格式
[{id:1,name:'《三国演义》',price:'200元'}]
// 首先我们从源数据中切割出需要的信息
let res = books.match(/^\s*#\d+\s+.+\s+#$/gm)
// 我们用match匹配到一个数组得到有效的数据
let booksRes = res.map(item => {
// console.log(item.trim().replace(/#/g, '').replace(/,/g, ' '))
let [id, name, price] = item.trim().replace(/#/g, '').replace(/,/g, ' ').replace(/\s+/g, ' ').split(' ')
return { id, name, price }
})
console.log(booksRes);
匹配模式 | 描述 |
---|---|
i | 不区分大小写, 执行对大小写不敏感的匹配 |
g | 执行全局匹配(查询所有匹配而非在找到第一个匹配后停止) |
m | 执行多行匹配 |
y | 粘附模式。表示只查找从lastIndex开始及之后的字符串 |
u | unicode模式 启用unicode匹配 |
s | dotAll模式 表示元字符匹配任何字符 (包括\n和\r) |
修饰符 | 描述 |
---|---|
. | 除换行外任何字符 |
d | 数字0-9 |
D | 除了数字 |
s | 匹配空白字符 |
S | 匹配非空白字符 |
w | 字母数字下划线 |
+ | 一个或多个 |