[技术博客] JS正则活学活用

正则基本语法

正则表达式（Regular Expression）是用单字符串来匹配一系列复合条件字符串的模式，对于乔姆斯基3型语法。

数学定义：
串行AB表示集合 {αβ | α ∈ A ，β ∈ B }
并行A|B表示集合{α | α ∈ A or α ∈ B}
子集复合A* 表示集合{a,b} = {ε,a,b,aa,ab,bb...}

这种定义下的正则表达式可以被有限自动机解析。

重复

• '*' : [0,∞]
• '+' ：[1,∞]
• {a，b}：重复次数的范围从a到b次

转义

同其余编程概念，转义有两种做用：

1. 将规定保留的特殊字符转换为正常字符，
   好比"."和"" 是正则中比较特殊的符号，使用""来实现转义，好比a.b表示"a.b"，a*b表示"ab"
2. 将正常字符转换成表示特殊含义的字符，
   好比"d"使用""以后就是"\d"表示数字

贪婪&懒惰模式

1. a.*b 表示尽量多的匹配以a开始，以b结束的字符串
2. a.*?b 表示尽量少的匹配以a开始，以b结束的字符串

Javascript场景

语法

//1. string 操做的字符串
    //2. regex 正则表达式
    //3. replacement 须要替换的效果
    string.replace(regex,replacement)
    
    //demo— /g表示全局替换
    str = str.replace(/raw/g,"dealed");

问题

调用博客园API直接返回的内容不能只用react native中的html解析组件直接使用。
能够使用JS正则进行处理。

解决

需求：<a href="url"><img src = "url" border="0" onload="..."/></a> 替换成 <img src="url"/>

图片解析

//$1表示第一个参数(.*?)匹配到的部分
function ConvertPicture(raw){
    let result = raw.replace(/<a href=(.*?) target="_blank"><img(.*?)<\/a>/g,'<img src=$1 alt="图片"/>');
    return result;
}

超连接解析

一样，其余的转换相似。
需求：<a href="http://www.hao123.com" target="_blank">测试超连接</a> 转换成 [测试超连接]("url")

function ConvertHref(raw){
    let result = raw.replace(/<a href=(.*?) target="_blank">(.*?)<\/a>/g,'["$2"]("$1")');
    return result;
}