字符串的模式匹配

承上启下

对于上篇中@Samaritains给的意见，底下查了一下，发现match()这个方法用在那里真的是太合适了。

var sum = document.getElementById('sum');
var click = document.getElementById('click');
click.addEventListener('click',function add(){
        var pattern = /\d+/g;
        var c = 0;
        var d = sum.value.match(pattern);
        for(var i = parseInt(d[0]); i <= parseInt(d[1]); i ++){
              c +=i;
        }
    alert(c);
},false);

首先match返回的是一个数组，并且对于文本框输入的格式没有了太多限制，只要输入的2个数字不是紧挨着的（固然中间也不能够用数字的），那么就能够获得想要的结果。Samaritains的一句话犹如海港的灯塔，指明了方向。既然提到了match，顺便杂谈下字符串的匹配。

字符串的模式匹配

1.match与字符串的羁绊

match() 方法将检索字符串 stringObject，以找到一个或多个与 RegExp 匹配的文本，并返回一个数组。match()只接受一个参数，要么是正则表达式，要么是一个RegExp对象。

match() 方法很大程度上依赖RegExp是否具备g标志。没有g标志的话，这个方法只能在字符串中执行一次匹配。

var str = 'hello world23o31';
var pat = /.o/;
var pat1 = /\d+/;
console.log(str.match(pat));//['lo']
console.log(str.match(pat1));//['23']

 获得匹配结果的同时，也在数组中存放了2个属性信息，包含index和input。

console.log(str.match(pat).index);//1
console.log(str.match(pat1).index);//11

再看下有g标志的匹配

var str = 'hello world23o32';
var pat = /.o/g;
var pat1 = /\d+/g;
console.log(str.match(pat));//["lo", "wo", "3o"]
console.log(str.match(pat1));//["23", "31"]

 很明显，match() 方法将执行全局检索，找到 字符串中的全部匹配子字符串。若是没有找到任何匹配的子串，则返回 null。若是找到了一个或多个匹配子串，则返回一个数组。不过全局匹配返回的数组与前者大不相同，它没有 index 属性或 input 属性，也就是说使用index和input会提示undefined。这一点是与exec()最大的区别了，exec()不管是否是在全局检索的状况下都会把index和input，固然还有lastIndex存放到数组中，这个就不细说了。因此若是想在全局检索中获取匹配项的信息，可使用exec()。

2.search()

search()方法很简单，就是返回与正则表达式或者字符串查找内容匹配的第一个子字符串的位置。若是没有匹配项，则会返回-1。

var str = 'abcDEF';
console.log(str.search('c')); //2
console.log(str.search('d')); //-1
console.log(str.search(/d/i));//3

其参数只有一个，能够是字符串，也能够是RegExp对象。我的认为search()相似match()的子功能，只是没有匹配项时返回的结果不一样。

3.split()

从字面就能够看出这是个分割的方法，基于制定的分隔符将一个字符串分割成多个字符串，并将结果放在数组中。其中有2个参数，第一个为必选，可使字符串或者正则表达式，第二个参数为可选，为一个整数，标识限制返回的片断，也就是数组的长度。

var str = "1234";
var str1 = "a、bd、c";
var arr = str.split("");
var arr1 = str1.split("、");
var arr2 = str1.split("、",2);
console.log(arr);//['1','2','3','4']
console.log(arr1);//['a','bd','c']
console.log(arr2);//['a','bd']

对于str1的分割应该都还好理解，就是简单的把"、"去掉，而后把由“、”隔开的每一个字符串依次放到一个数组中，后面的2规定了新数组的长度。而第一个用空字符串进行分割，至关于把每一个字符进行分开，获得由每一个字符组成的数组。若是我在“”中加一个空格或者其余与1234不一样的字符，获得的结果就是['1234']，这是由于在str中没有找到匹配的项，以致于split()会按照没有传参进行分割，split()在没有参数的状况下返回的数组包含一个元素，该元素是原字符串。

经过split()函数能够获取一些想要的东西，好比我前面写的那个叠加，好比我想要经过qq邮箱获取到qq号码，再好比我想获取某个手机号的后四位。就说最后一个例子吧。

<input id="num" type="text"/>
<input id="n" type="text"/>
<input type="button" onclick="num()" value="获取手机号后四位"/>

先列出2个文本框，第一个为输入的手机号，另外一个为手机号后四位。

function num(){
    var a = document.getElementById("num").value;
    var b = document.getElementById("n");
    var c = a.split("");
    var d = c[7] + c[8] + c[9] + c[10];
    b.value = d;
}

这样就很容易获得了。

4.灵魂般的replace()

对于replace()，简单一看就是替换。能够传入俩个参数，第一个参数能够是字符串也能够是正则对象，第二个参数可使字符串也能够是函数。因为它的第二个参数能够传入函数，致使其具备很强的灵活性，应用的范围很广。该方法并不改变调用它的字符串自己，而只是返回替换后的字符串。在这就很少介绍了，由于内容太多，就单独拿出来写了。

结尾

此次写的有些仓促，不太详细。在周日以前会把replace()函数和match()与exec()的区别会详细的罗列出来。