正则表达式在js中的应用

1、js中的查找API

  1.1 indexOf和lastIndexOf方法

  不支持正则,只能查找具体的关键词,一次只能查找一个。如果查到,返回结果是关键词的在字符串中的下标,否则返回-1。格式如下:

var i = str.indexOf("key",beginIndex);
var i = str.lastIndexOf("key",beginIndex);

  1.2 search方法

  在字符串中查找第一个和正则表达式匹配的关键词,只能判断字符串中有没有匹配成功的关键字,不能把全部匹配的查出来。如果没有匹配成功的,返回-1

var i = str.search(/reg/);

  1.3 match方法

  可以获得所有和正则匹配的关键词,返回的是数组,包含所有匹配的关键词的内容。默认情况下,只查找一个。如果没有匹配的,返回null。

var arr  = str.match(/reg/);    //只查找第一个
var arr  = str.match(/reg/gi);    //g:查找全部  i:忽略大小写

注意:因为返回值可能是“null”,所以在编程时,需要加入相应的判断。

var str = "Do you want a friend whom you could tell everything to?";
var arr = str.match(/you/gi);
if(arr){
    console.log("一共找到"+arr.length+"个关键词");
}else{
  console.log("没找到");
}

  1.4 三种字符串查找API的总结:

    1) indexOf和lastIndexOf只能查找关键词的位置,不支持正则。

    2) search方法只能判断字符串中是否包含关键词。无法得到开始位置,也不支持参数g

    3)match方法,只能查找出每一个关键词,不能查找出关键词的位置。

  1.5 RegExp对象方法:exec方法

  既获得每个关键词的内容,又能获得每个关键词的位置。

 

2、替换

  replace方法,找到字符串中和正则匹配的关键词,用新内容替换这些旧内容。默认只能替换第一个,正则后加参数g,方可替换所有。

var newStr = str.replace(/reg/gi,"newContent");

注意:字符串一旦创建,不可修改,故这个方法返回的是新字符串,需要一个变量保存。

var str = "Do you want a friend whom you could tell everything to?";
//获得str中所有的do或者to,保存在kwords中
var kwords = str.match(/[dt]o/gi);
//替换str中所有匹配成功的关键词
str = str.replace(/[dt]o/gi,"**");
console.log(str);
console.log("一共替换了"+kwords?kwords.length:0+"处");

 

3、删除

  replace方法,将替换的新内容设置为""即可。

1 //去掉字符串开头的空字符
 2 function ltrim(str){
 3     return str.replace(/^\s+/,"");
 4 }
 5 
 6 //去掉字符串结尾的空字符
 7 function rtrim(str){
 8     return str.replace(/\s+$/,"");
 9 }
10 
11 //去掉字符串开头和结尾的空字符
12 function trim(str){
13     return str.replace(/^\s+|\s+$/g,"");
14 }
15 
16 var str = "\t  Joyce Chen \t";
17 console.log(ltrim(str));
18 console.log(rtrim(str));
19 console.log(trim(str));

注意:目前一些新的浏览器已经能够支持trim方法。

var newStr = str.trim();        //去字符串的前后空字符

练习:替换的新内容不是固定的。

1 var str = "真正的程序员从来不写注释,难写的程序必定也难读。"
 2     +"真正的程序员不写应用程序,他们从最底层的裸机开始编程。"
 3     +"真正的程序员他们认为应用程序编程是那些不会系统编程的人干的活。"
 4     +"真正的程序员不画流程图,流程图是没文化的人的文档,居住在山洞里的人才在岩壁上画流程图。";
 5 var reg = /程序员|注释|编程/;
 6 var arr = null;
 7 while(arr = str.match(reg)){
 8     str = str.replace(reg,arr[0].length>2?"***":"**");
 9 }
10 console.log(str);

 

4、格式化

  格式化是将正则表达式匹配的内容,替换为新的格式。步骤:①使用正则将原字符串分组;②将原字符串用$n代替,其中n表示①中的第n个分组。如:

//根据身份证号,显示出生年月日
var str = "111111199404060000";
var birth = str.slice(6,6+8);
var reg = /(\d{4})(\d{2})(\d{2})/;
var birth = birth.replace(reg,"$1年$2月$3日");
console.log(birth);

 或者:

var str = "111111199404060000";
var reg = /(\d{6})(\d{4})(\d{2})(\d{2})(\d{4})/;
var birth = str.replace(reg,"$2年$3月$4日");

 

5、切割

  split方法,split(reg):根据匹配的正则,分隔字符串为数组。

1 <ul id="things">
 2   <li>book</li><li>pen</li><li>pencil</li><li>dictionary</li><li>desk</li><li>table</li>
 3 </ul>
 4 <button onclick="sort(this)">up</button>
 5 <script type="text/javascript">
 6     function sort(btn){
 7         //获取id为things下的innerHTML,保存在str中
 8         var str = document.getElementById("things").innerHTML;
 9         //将str去掉前后的空字符,截取4~-5位置的字符串,按“</li>\s*<li>”分割,结果保存在arr中a
10         var arr = str.trim().slice(4,-5).split(/<\/li>\s*<li>/);
11         //将arr数组排序
12       arr.sort();
13         //如果btn的innerHTML=="递减排序",将str数组反转
14       if(btn.innerHTML == "down"){
15           btn.innerHTML="up"
16           arr.reverse();
17       }else{
18           btn.innerHTML = "down";
19       }
20         //将arr中每个元素按“</li><li>拼接,前加“<li>”,后加“</li>”,并把拼接结果代替id为things的innerHTML。
21        document.getElementById("things").innerHTML = "<li>"+arr.join("</li><li>")+"</li>"
22   }
23 </script>

 

6、实际应用

  6.1 统计字符串中每个字符出现的次数,并输出最多的字符及次数

1 function calcTimes(str){
 2   //将str打撒成字符数组,在排序,保存在chars中
 3   var chars = str.split("");
 4   chars.sort();
 5   //在讲chars拼接成一个字符串
 6   str = chars.join("");
 7   var reg = /(.)\1*/g;
 8   var arr = str.match(reg);
 9   //输出每种字符的个数
10   for(var i =0;i<arr.length;i++){
11     console.log(arr[i].charAt(0)+":"+arr[i].length);
12   }
13   //输出最多的字符及个数
14   //将arr按每个元素的长度排序
15   arr.sort(function(a,b){return b.length-a.length});
16   //输出第0个元素的字符和length
17   console.log("输出第0个元素的字符和length");
18   console.log(arr[0].charAt(0)+":"+arr[0].length);
19 }
20 
21 str = "fashion knows not of comfort."
22 calcTimes(str);

6.2 去掉数组中重复的元素

var arr = [];
for(var i=0;i<20;i++){
    arr.push(parseInt(Math.random()*20));
}
console.log("原数组:");
console.log(arr);
function quchongfu(arr){//将数组先排序,后以“,,”为连接符,连接成字符串,去重,分割
    return arr.sort(function(a,b){return (a-b)})
        .join(",,")
        .replace(/(^|,)([^,]+)(,,\2)+(,|$)/g,"$1$2$4")
        .split(",,");
}
console.log("去重复后的数组");
console.log(quchongfu(arr));

如果是删除所有重复元素,代码如下:

var arr = [];
for(var i=0;i<20;i++){
    arr.push(parseInt(Math.random()*20));
}
console.log("原数组:");
console.log(arr);
function quchongfu(arr){
    //将数组先排序,后以“,,”为连接符,连接成字符串,删除重复元素,分割
    return arr.sort(function(a,b){return (a-b)})
        .join(",,")
        .replace(/(^|,)([^,]+)(,,\2)+(,|$)/g,"")
        .replace(/^,|,$/,"")
        .split(",,");
}
console.log("删除所有重复元素后的数组:");
console.log(quchongfu(arr));