开发进阶-超详细正则表达式

Hello~，这里先举一个例子来引出标题所用到的内容

模板变量替换

let userName = 'jack'
let value = '${userName} is learning C-walk'

最终输出 jack is learning C-walk

最笨的办法：空格分离数组，把userName赋值给数组第一位，然后再以空格形式重新组合为一个字符串，当然不是最优的办法。

这里引出正则表达式，很多人估计跟我一样开发的时候直接百度“常用正则表达式”解决一切字符串匹配问题，如果找不到呢，那就需要自行手写了。笔者认为这个无论是使用Java、Node开发服务端还是前端都是要用到的，因为笔者是个菜鸟前端，就用JavaScript来讲解下

一、两种操作

1、 创建  分两种形式 
（1） 实例化创建
let reg = new RegExp('a', 'ig') // 第一个参数表达式  第二个参数表达式修饰符
（2） 字面量创建
let reg = /a/  /** attention please 创建表达式必须要使用 //! */

2、校验  也分两种形式
（1） test  布尔形式返回   成功true  失败false
（2） exec  成功返回一个装有字符串的数组的集合  失败null

example1：
let exp = /abc/
console.log(exp.test('abc'))  // true
console.log(exp.exec('abc'))  // [ 'abc', index: 0, input: 'abc', groups: undefined ]


二、超级烦人的工具：元字符  （说实话我一开始是个超级菜鸟的时候，看不懂这乱七八糟的玩意）

1、边界符 表示开头和结尾
^:以谁开始  $:以谁结束

example2：
console.log(/^睡觉/.test('睡觉吧'))  // true
console.log(/^睡觉$/.test('睡觉吧'))  // false  因为结尾不是以睡觉为结尾
cosnole.log(/一起学习$/.test('学习'))  // true


2、量词 表示重复的次数

*   重复零次或更多次  >=0
+   重复一次或更多次  >=1
?   重复零次或一次    0 || 1
{n}  重复n次
{n,}  重复n次或更多次
// {n,m}    重复n次到m次

console.log(/^(nike)*$/.test('nike'))  // true 因为nike被匹配到1次了
console.log(/^(nike)*$/.test(''))  // true 因为nike没匹配到
console.log(/^哈+/.test('大哈')) // false 不是以哈开头
console.log(/哈哈/.test('大哈')) // false "哈"出现两次了

3、字符类
基础：[]匹配字符集合 只要有一个字符在这里面展示就会校验正确

[a-z] 匹配小写字母集合
[A-Z] 匹配大写字母集合
[0-9] 匹配数字字符集合

[] 内部加入^表示取反的意思
[^0-2] 表示匹配除0-2以外的数字

console.log(/[abc]$/.test('dab'), 'abc结尾');  // true
console.log(/^[abc]/.test('abceee'), 'abc开始'); // true

console.log(/[abc]{2}/.test('bc1'), '匹配两个字符') //{}代表有几个符合规则字符,所以abc只要有两个匹配到就是true

console.log(/[a-z]/.test('fkcvv'), '匹配小写字母') // true
console.log(/[A-Z]/.test('Bny'), '匹配大写字母') // true

example3: 4位数校验
let reg = /^[1-9][0-9][0-9][0-9]$/
console.log(reg.test('28'), '4位数校验'); 
// true的条件必须是1000以上才是正确的，展示false因为后两位没校验到，写了几个[]就校验几个字符

console.log(/[^A-C][d-k]$/.test('Back'), '66'); // 此时匹配除了A-C字符,结尾必须是d-k

4、预定类特殊字符
\d <=> [0-9] 匹配0-9内任意数字字符
\D <=> [^0-9] 取返,匹配非0-9内任意数字字符
\w <=> [A-Za-z0-9] 匹配任意字母 数字 下划线 
\W <=> [^A-Za-z0-9] 取返,匹配任意字母 数字 下划线 
\s <=> 匹配空格(包括换行符 制表符 空格符) [\t\r\n\v\f]
\S <=> 匹配非空格字符,相当于 [^\t\r\n\v\f]
\表达式 匹配自定义表达式

example4: 校验日期
let str = '2007-12-30'
let dateReg = /\d{4}-(0+\d|1+[0,2])-([0-2]\d|3[0-1])/
console.log(dateReg.test(str), 'true'); // true

表达式解读：
d{4} 因为年份支持到9999，所以[0-9]可以重复4次
(0+\d|1+[0,2]) 使用 | 表示逻辑或 月份01-09，10-12 分两种情况考虑
([0-2]\d|3[0-1]) 用上面的思路分析，同样的逻辑

ps：当然校验日期还有别的写法，这里只展示一种，毕竟不同需求不同对待


5、修饰符
基本格式: /表达式/修饰符
i ignore缩写 正则匹配时字母不区分大小写
g global缩写 匹配所有满足正则表达式的结果


console.log(/javascript/.test('javascript'), '~~javascript1')  //true 直接匹配
console.log(/javascript/i.test('Javascript'), '~~javascript2') //true 忽略大小写匹配
console.log(/javascript/g.test('aa_javascript__22'), '~~aa_javascript__22') //true 

6、replace的使用  字符串常用操作用来替换
基本： str.replace(正则表达式 | 待替换文本, 要替换文本)
let str1 = '代码code'
console.log(str1.replace(/code/g, '08')); // 代码08

到这里，来解答下最开始的问题

let userName = 'jack'
let value = '${userName} is learning C-walk'
let res = value.replace(/\${\w+}/, userName)  // jack is learning C-walk

好了，欢迎大家来交流~，一起进步