正则表达式

91 阅读3分钟
元字符描述
^以谁开始
$以谁结束
\转义字符,有些字符有特殊含义,用\可以使其恢复为字符本身的含义
竖杠
!或[^regex]
{}里面表示重复次数
[]里面的字符多选一
()优先级
*>=0次
+>=1次
?零次或一次
{n}n次
{n,}>=n次
{n,m}n次到m次
.除了换行符之外的任意字符
\d0-9之间任一数字,相当于[0-9]
\D0-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]
\n换行符
\f换页符
\r回车符
\s空白符
\t制表符
g全局匹配
i忽略大小写
gi全局匹配+忽略大小写
m每一行单独匹配
案例:用正则表达式解析svg的path路径:
    `let d = 'M95 710 A50 50 90 0 1 145 660L145 710Z';//绘制了一个扇形
    
    console.log("第一个值(cos角一=(a-c)/r)",d.match(/\s*M\d*(\.\d*)?/g)[0].replace(/\s*M/,'')*1)
    //  原理:匹配M95 710 A50,用空代替M95 710 A,得到50
    console.log("第三个值(半径)",d.match(/\s*M\d*(\.\d*)?\s*\d*(\.\d*)?\s*(\n)?\s*A\d*(\.\d*)?/g)[0].replace(/\s*M\d*(\.\d*)?\s*\d*(\.\d*)?\s*(\n)?\s*A/,'')*1)
    console.log("第四个值(半径)",d.match(/\s*M\d*(\.\d*)?\s*\d*(\.\d*)?\s*(\n)?\s*A\d*(\.\d*)?\s\d*(\.\d*)?/g)[0]
    .replace(/\s*M\d*(\.\d*)?\s*\d*(\.\d*)?\s*(\n)?\s*A\d*(\.\d*)?/,'')*1)
     console.log("第五个值(角二减去角一)",d.match(/\s*M\d*(\.\d*)?\s*\d*(\.\d*)?\s*(\n)?\s*A\d*(\.\d*)?\s\d*(\.\d*)?\s*(-)?\d*(\.\d*)?/g)[0]
     .replace(/\s*M\d*(\.\d*)?\s*\d*(\.\d*)?\s*(\n)?\s*A\d*(\.\d*)?\s\d*(\.\d*)?\s*/,'')*1)
    console.log("第六个值",d.match(/\s*M\d*(\.\d*)?\s*\d*(\.\d*)?\s*(\n)?\s*A\d*(\.\d*)?\s\d*(\.\d*)?\s*(-)?\d*(\.\d*)?\s\d*(\.\d*)?/g)[0]
    .replace(/\s*M\d*(\.\d*)?\s*\d*(\.\d*)?\s*(\n)?\s*A\d*(\.\d*)?\s\d*(\.\d*)?\s*(-)?\d*(\.\d*)?\s/,'')*1)
    console.log("第七个值",d.match(/\s*M\d*(\.\d*)?\s*\d*(\.\d*)?\s*(\n)?\s*A\d*(\.\d*)?\s\d*(\.\d*)?\s*(-)?\d*(\.\d*)?\s\d*(\.\d*)?\s\d*/g)[0]
    .replace(/\s*M\d*(\.\d*)?\s*\d*(\.\d*)?\s*(\n)?\s*A\d*(\.\d*)?\s\d*(\.\d*)?\s*(-)?\d*(\.\d*)?\s\d*(\.\d*)?\s/,'')*1)
    console.log("第八个值",d.match(/\s*M\d*(\.\d*)?\s*\d*(\.\d*)?\s*(\n)?\s*A\d*(\.\d*)?\s\d*(\.\d*)?\s*(-)?\d*(\.\d*)?\s\d*(\.\d*)?\s\d*\s\d*(\.\d*)?/g)[0]
    .replace(/\s*M\d*(\.\d*)?\s*\d*(\.\d*)?\s*(\n)?\s*A\d*(\.\d*)?\s\d*(\.\d*)?\s*(-)?\d*(\.\d*)?\s\d*(\.\d*)?\s\d*\s/,'')*1)
    console.log("第九个值",d.match(/\s*M\d*(\.\d*)?\s*\d*(\.\d*)?\s*(\n)?\s*A\d*(\.\d*)?\s\d*(\.\d*)?\s*(-)?\d*(\.\d*)?\s\d*(\.\d*)?\s\d*\s\d*(\.\d*)?\s\d*(\.\d*)?/g)[0]
    .replace(/\s*M\d*(\.\d*)?\s*\d*(\.\d*)?\s*(\n)?\s*A\d*(\.\d*)?\s\d*(\.\d*)?\s*(-)?\d*(\.\d*)?\s\d*(\.\d*)?\s\d*\s\d*(\.\d*)?\s/,'')*1)
    console.log("第十个值(圆心x)",d.match(/\s*M\d*(\.\d*)?\s*\d*(\.\d*)?\s*(\n)?\s*A\d*(\.\d*)?\s\d*(\.\d*)?\s*(-)?\d*(\.\d*)?\s\d*(\.\d*)?\s\d*\s\d*(\.\d*)?\s\d*(\.\d*)?\s*(\n)?L\d*(\.\d*)?/g)[0]
    .replace(/\s*M\d*(\.\d*)?\s*\d*(\.\d*)?\s*(\n)?\s*A\d*(\.\d*)?\s\d*(\.\d*)?\s*(-)?\d*(\.\d*)?\s\d*(\.\d*)?\s\d*\s\d*(\.\d*)?\s\d*(\.\d*)?\s*(\n)?L/,'')*1)
    console.log("第十一个值(圆心y)",d.match(/\s*M\d*(\.\d*)?\s*\d*(\.\d*)?\s*(\n)?\s*A\d*(\.\d*)?\s\d*(\.\d*)?\s*(-)?\d*(\.\d*)?\s\d*(\.\d*)?\s\d*\s\d*(\.\d*)?\s\d*(\.\d*)?\s*(\n)?L\d*(\.\d*)?\s\d*(\.\d*)?/g)[0]
    .replace(/\s*M\d*(\.\d*)?\s*\d*(\.\d*)?\s*(\n)?\s*A\d*(\.\d*)?\s\d*(\.\d*)?\s*(-)?\d*(\.\d*)?\s\d*(\.\d*)?\s\d*\s\d*(\.\d*)?\s\d*(\.\d*)?\s*(\n)?L\d*(\.\d*)?\s/,'')*1)

案例:去掉字母前面的小数点后几位

''.replace.call(5.000000000000001e-14,/(?<=\d.\d)\d+(?=e.\*)/,'')//5.0e-14

案例:利用正则表达式来截取字符串获得x,y方向的translate:

let str = "translate(100,200)"
str.match(/translate((.*),(.*))/)
let x = str.match(/translate((.*),(.*))/)\[1] \* 1
let y = str.match(/translate((.*),(.*))/)\[2]\*1