JavaScript中正则的使用（1）

通过例子学习正则中的常见语法（1）

1. $num

   var a = 'javascript';
   var b = a.replace(/(java)(script)/gi, '$2-$1');
   console.log(b);//script-java
   

   • 正则以/开始和结尾，中间为要匹配的表达式
   • g表示全局搜索，i表示忽略大小写，m表示多行匹配
   • $1、$2表示第1个和第2个子表达式（用小括号包裹）匹配到的文本，如例子所见，$1为java，$2为script
     

2. $&

   var a = 'javascript';
   var b = a.replace(/a/gi, '$&-$&');
   console.log(b);//ja-ava-ascript
   

   • $&表示匹配到的文本，即$&匹配到a
   • 将javascript中的a替换为a-a，所以最终结果为ja-ava-ascript
     

3. $`

   var a = 'javascript';
   var b = a.replace(/(script)/gi, '$&-$`');
   console.log(b);//javascript-java
   

   • $`表示匹配到的文本的左侧文本，即$`匹配到java
   • 将script替换为script-java，所以最终结果为javascript-java
     

4. $'

   var a = 'javascript';
   var b = a.replace(/(java)/gi, '$&-$\'');
   console.log(b);//java-scriptscript
   

   • $'表示匹配到的文本的右侧文本，即$'匹配到script
   • 将java替换为java-scripr，所以结果为java-scriptscript
   • 注意：$&-$\'，如果用'包裹结果，需要\ 转义，如果用"包裹结果，则不需要转义
     

5. $$

   var a = 'javascript';
   var b = a.replace(/a/gi, '$$');
   console.log(b);//j$v$script
   

   • $$表示对$进行转义输出
   • 将a替换为$
     

6. replace

   var a = 'this is a javascript text';
   var b = a.replace(/\b(\w)(\w*)\b/g, fn);
   console.log(b);//This Is A Javascript Text
   
   function fn($1, $2, $3) {
       return $2.toUpperCase() + $3;
   }
   

   • replace接受两个参数，第一个为正则表达式,第二个可以为文本，也可以为函数
   • \b表示单词的分界线
   • \w表示字母、数字、下划线或者汉字
   • fn中共接收了三个参数
   • $1表示整个正则表达式匹配到的文本，依次为this，is，a，javascript，text
   • $2表示第一个子表达式(\w)匹配到的文本，分别为t，i，a，j，t
   • $3表示第二个子表达式(\w*)匹配到的文本，分别为his，s，(空的内容)，avascript，ext
   • $2.toUpperCase()将$2匹配到的文本转换为大写
   • 结果This Is A Javascript Text
     

7. replace后fn详细内容

   var a = 'this is a javascript text';
   var b = a.replace(/\b(\w)(\w*)\b/g, fn);
   console.log(b);
   //this-t-his-0-this is a javascript text& is-i-s-5-this is a javascript text& a-a--8-this is a javascript text& javascript-j-avascript-10-this is a javascript text& text-t-ext-21-this is a javascript text&
   function fn($1, $2, $3, $4, $5) {
       return $1 + '-' + $2 + '-' + $3 + '-' + $4 + '-' + $5 + '&';
   }
   

   • 在例子6中介绍了$1, $2, $3，其实$2至$3可以有多个，数量随正则中的子表达式变化，因为/\b(\w)(\w*)\b/中只有两个子表达式，所以只有$2和$3
   • fn最后两个参数（不一定是$4和$5），分别表示正则匹配到的文本($1)开始位置（如匹配到javascript，$4就是javascript在整段文本中的开始位置10）和整个要匹配的文本（this is a javascript text）
   • 根据以上分析，结果如下