JavaScript-正则表达式的简单案例和解释

146 阅读2分钟

Js-正则表达式的简单案例和解释

在学习字符串处理的时候,发现有一部分是通过正则表达式实现的,通过匹配字符串里的字符进行分类,然后摘取自己想要的部分,剔除不需要的部分,具体代码如下:


  return target.split(',').map(item =>{
​
•    const reg = /(\d{1,})(~\d{1,})*(~\d{1,})/;
​
•    return item.replace(reg, '$1$3');
​
  }).join();

对于以上reg部分的正则表达式非常困惑,总结下来就是什么乱七八糟的。


然后就去翻看JS的教程,确实在这方面的学习有所疏漏,具体教程链接如下:

[网道/JavaScript-RegExp对象]  wangdoc.com/javascript/… 网道/JavaScript-RegExp对象

1.1 RegExp 实例对象

RegExp.prototype.testRegExp.prototype.exec

正则表达式.test('需要测试匹配的字符串')

test 顾名思义就是测试 是否匹配成功的 ,如果匹配成功那就true ;失败就是false

exec 字面意思是执行, 匹配成功的就返回一个数组,包含了匹配成功的项

1.2 String的实例对象

  • String.prototype.match() :返回一个数组,成员是所有匹配的子字符串。
  • String.prototype.search() :按照给定的正则表达式进行搜索,返回一个整数,表示匹配开始的位置。
  • String.prototype.replace() :按照给定的正则表达式进行替换,返回替换后的字符串。
  • String.prototype.split() :按照给定规则进行字符串分割,返回一个数组,包含分割后的各个成员。

1.3 本例中的匹配规则

前两个都不是重点,本次学习的重点是正则表达式的真正语法

从问题入手 上面这个正则表达式到底是什么意思?

const reg = /(\d{1,})(~\d{1,})*(~\d{1,})/;


首先,正则表达式以两个斜杆号作为起始和结尾 /正则表达式/

其次,小括号表示的是组匹配的模式,这里主要分为三组进行匹配,分别是 (\d{1,}) (~\d{1,}) (~\d{1,})*

在之后的代码执行中可以以 $1、$2、$3 代表

其中,

1、 (\d{1,}) 以第一组为例,\d 是预定义模式

  • \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]
  • \b 匹配词的边界。
  • \B 匹配非词边界,即在词的内部。

所以可以看到匹配的是0-9的数字,也就是[0-9]的意思 (ps:中括号表示连字符,[0-9]就是123456789的意思)

然后 {1,} 是什么意思呢?{}花括号表示的是重复类的意思,重复类就是对前面的/d可以重复匹配的意思

{n,m} 表示可以重复n-m次,那么{1,} 就是重复至少1次 , 那么 /d{1,} 表示的就是0~∞的数字,可以匹配个位数、十位数、千位数....

2、 (~\d{1,})* 这里多加了 ~ 和 ***** ,~没有其他意思就是字面量字符,所谓字面量字符就是一对一的字面意思匹配,所以这组的意思就是匹配’~0‘ 到 '~∞' ,那么*是什么意思呢? *号是量词符,表示的是{0,},也就是说这整组可以重复或者不重复,或者没有也行。

量词符

  • ? 问号表示某个模式出现0次或1次,等同于{0, 1}
  • * 星号表示某个模式出现0次或多次,等同于{0,}
  • + 加号表示某个模式出现1次或多次,等同于{1,}

所以以'1~2~3~4~5'为例子,分为三大块,分别是1,1, 2, $3。

$1 : '1'

$2: '~2~3~4'

$3: '~5'

所以最终通过replace函数,只留下113,最后生成1~5

1.4 其他匹配规则

请参考链接,链接已经整理的很好了,不再做重复笔记,以后有问题直接查看就行。