深入javascript中的exec与match方法

视频课堂https://edu.csdn.net/course/play/7621

经典面试题，如果知晓一下题目的答案，那就没有必要往下看了。

var someText="web2.0 .net2.0";
var pattern=/(\w+)(\d)\.(\d)/g;
var outCome_exec=pattern.exec(someText);
var outCome_matc=someText.match(pattern);

What is outCome_exec[1] and outCome_matc[1]?

Choice A: true
Choice B: false
Choice C: null
Choice D: Web
Choice E: Web2.0
Choice F: undefined
Choice G: net2.0

思考1分钟ing........

在使用match方法时，如果不指定g属性，则与RegExp对象的exec方法可以等价，而不是只有一个元素的数组。

举例：

var str= "ahi" ;
var exp=/a(hi)/;

var arr1 = exp.exec(str);
var arr2 = str.match(exp);
alert(arr1);//结果：arr1.length==2;arr1[0]==ahi;arr1[1]==hi;
alert(arr2);//结果：arr2.length==2;arr2[0]==ahi;arr1[1]==hi;结果同上

3-2）同时，在js帮助文档中，在执行exec方法时，如果有属性g，将该对象的匹配的开始位置设置到紧接这匹配子串的字符位置，当第二次调用exec时，将从
lastIndex所指示的字符位置开始检索。利用这个特点可以反复调用exec遍历所有匹配，此时等价于match具有g属性的情况（其实就是将匹配的结果放入Matches 集合中去了）。

举例如下：

a）有属性g的情况时，更新了index和lastIndex，对下次检索起到作用：

function RegExpTest() {
 var src = "The rain in Spain falls mainly in the plain.";
 var re = /(\w+)/g; // 创建正则表达式模式。
 var arr;
 while ((arr = re.exec(src)) != null){
 document.write(arr.index + "-" + RegExp.lastIndex + "\t" + arr[0]);//此处RegExp.lastIndex和arr.lastIndex均有同样的属性，可以互换。在此注意IE6和7的lastIndex重设置0的bug

}
};

RegExpTest();

//以上例子可以遍历所匹配的内容。并可得到每个小匹配的index和lastIndex；

b）如果以上例子没有g的情况，则以上例子，exec方法没有更新RegExp 对象的全局属性（index、lastIndex等），以上例子会陷入死循环，index和lastIndex一直为0和3

可见属性g在exec过程中可以改变index和lastIndex等的值，以便下一次检索的位置，match方法无此能力。

4.关于index和lastIndex等属性（帮助中还有leftContext、rightContext、lastMatch、lastParen(最后一个括号)，但是这些属性均以index和lastindex为基础）。

4-1）只读属性。

如下例子：

var src = "The rain in Spain falls mainly in the plain.";
 var re = /(\w+)/g; // 创建正则表达式模式。
 var arr;
 arr = re.exec(src);
 RegExp.lastIndex = 0;
 RegExp.index = 0;
 arr.lastIndex = 0;
 arr.index = 0;

document.write(arr.index + "-" + arr.lastIndex + "\t" + arr[0]+"**********"+RegExp.index + "-" + RegExp.lastIndex + "\t" + arr[0]);

//结果为0-0 The**********0-3 The。

究其原因也就是RegExp的属性是只读的，即使js语言的灵活性，可以修任何属性或添加任何属性，均不报语法错误。但是依旧无法RegExp的属性更改，但是arrary对象则是可以更改，但是每次执行一次exec，就会将RegExp.index等属性重新赋值给返回的Arrary对象。

例如：

var src = "The rain in Spain falls mainly in the plain.";
var re = /(\w+)/g; // 创建正则表达式模式。
var arr;
arr = re.exec(src);
RegExp.lastIndex = 0;
RegExp.index = 0;
arr.lastIndex = 0;
arr.index = 0;

document.write(arr.index + "-" + arr.lastIndex + "\t" + arr[0]+"**********"+RegExp.index + "-" + RegExp.lastIndex + "\t" + arr[0]);

//执行第二次arr的index属性会被更新，其实是RegExp对象实例在执行exec方法时，更新全局的RegExp.index和arr的index等，在后边会介绍

arr = re.exec(src);
document.write(" "+arr.index + "-" + arr.lastIndex + "\t" + arr[0]+"**********"+RegExp.index + "-" + RegExp.lastIndex + "\t" + arr[0]);

//0-0 The**********0-3 The
//4-8 rain**********4-8 rain

4-2）不同的RegExp实例对象交叉执行exec时，index、lastIndex等属性互不影响。每次执行exec或者执行String的match方法时，都会给RexExp.index等赋予新值。（这个其实是必须的，只是我在这脑袋一犯浑，给理解错了，主要是因为“RegExp.lastIndex = 0;”可以被赋值，但是取值时，结果又没有改变，让我脑袋混乱了。）

开始我以为如果两个RegExp对象在交叉执行exec时，可能index等会清零。因为我认为index属性是保存在RegExp的全局静态属性上的。现在发现是保存在具体的RegExp实例上，每次执行exec或者执行String的match方法时，都会给RexExp.index等赋予新值。

呵呵，这可能是习惯了c和java中类和类实例的想法的人常犯的错误，认为RegExp是个类，RegExp.index是一个类的static属性。这样认为没错，但是他的值是是会在执行exec和String的match方法时，被正则对象更新。

举例如下：

var src = "The rain in Spain falls mainly in the plain.";

 var re1 = /(\w+)/; // 创建正则表达式模式。
 var re2 = /(\w+)/g; // 创建正则表达式模式。
 var arr;

arr = re1.exec(src);
 document.write("R1第一次执行exec:"+RegExp.index + "-" + RegExp.lastIndex + "\t" + arr[0]);

 arr = re2.exec(src);
 document.write(" R2第一次执行exec:"+RegExp.index + "-" + RegExp.lastIndex + "\t" + arr[0]);

 arr = re1.exec(src);
 document.write(" R1第二次执行exec:"+RegExp.index + "-" + RegExp.lastIndex + "\t" + arr[0]);

arr = re2.exec(src);
 document.write(" R2第二次执行exec:"+RegExp.index + "-" + RegExp.lastIndex + "\t" + arr[0]);

输出的结果如下：

R1第一次执行exec:0-3 The
R2第一次执行exec:0-3 The
R1第二次执行exec:0-3 The
R2第二次执行exec:4-8 rain

4-3）String对象的match方法，无法像exec方法那样获取中间查找的对象的index和lastIndex，也就是说是一次性的。即无法得到下一次检索的位置，match方法在设置g属性时，只能获取最后一个检索和index和lastIndex；match在没有设置g属性时，仅仅获得第一个匹配的index和lastIndex。

举例如下：

a）

var src = "The rain in Spain falls mainly in the plain.";
var re = /\w+/g; //有g属性。
var i = 0;
while (i++<10){
 arr = src.match(re);
 document.write(RegExp.index + "-" + RegExp.lastIndex + "\t" + arr + " ");

}

//结果如下：

38-43 The,rain,in,Spain,falls,mainly,in,the,plain
38-43 The,rain,in,Spain,falls,mainly,in,the,plain
38-43 The,rain,in,Spain,falls,mainly,in,the,plain
38-43 The,rain,in,Spain,falls,mainly,in,the,plain
38-43 The,rain,in,Spain,falls,mainly,in,the,plain
38-43 The,rain,in,Spain,falls,mainly,in,the,plain
38-43 The,rain,in,Spain,falls,mainly,in,the,plain
38-43 The,rain,in,Spain,falls,mainly,in,the,plain
38-43 The,rain,in,Spain,falls,mainly,in,the,plain
38-43 The,rain,in,Spain,falls,mainly,in,the,plain

b）

var src = "The rain in Spain falls mainly in the plain.";
var re = /\w+/; // 无g属性。
var i = 0;
while (i++<10){
 arr = src.match(re);
 document.write(RegExp.index + "-" + RegExp.lastIndex + "\t" + arr + " ");

}
//结果如下：

0-3 The
0-3 The
0-3 The
0-3 The
0-3 The
0-3 The
0-3 The
0-3 The
0-3 The
0-3 The

c)

var src = "The rain in Spain falls mainly in the plain.";
var re = /\w+/g;
var i = 0;
arr = src.match(re);
while (arr[i]!=null){
 document.write(RegExp.index + "-" + RegExp.lastIndex + "\t" + arr[i] + " ");
 i++;
}
//结果如下：

38-43 The
38-43 rain
38-43 in
38-43 Spain
38-43 falls
38-43 mainly
38-43 in
38-43 the
38-43 plain

5.最后结论（如有不对，请指正）：

1）exec是RegExp对象方法，match是String对象方法；

2）如果没有找到结果，则二者都返回null；

3）只有在正则表达式必须指定全局g属性时，match才能返回所有匹配，否则match与exec方法结果无差异，是等价的；

4）exec永远返回与第一个匹配相关的信息，其返回数组第一个值是第一个匹配的字串，剩下的是所有分组的反向引用（即子括号的匹配内容）；

5）exec在设置g属性后，虽然匹配结果不受g的影响，返回结果仍然是一个数组（第一个值是第一个匹配到的字符串，以后的为分组匹配内容），但是会改变index和lastIndex等的值，将该对象的匹配的开始位置设置到紧接这匹配子串的字符位置，当第二次调用exec时，将从lastIndex所指示的字符位置开始检索。同样match方法在设置了g属性后，也会改变index和lastIndex的值，但是是一次性的。无法像exec那样能逐过程累积（即将结果放入Matches 集合中去了），因此无法累积获取下一次检索的位置。

PS：

最开始那个问题的答案为D和G。你想明白了么？

以上测试均在ie和firefox中测试过，结果一致。

以上测试的前提是javascript支持RegExp对象。早期浏览器的javascript引擎未必支持正则对象或者未必支持正则表达式对象的某些属性。

深入javascript中的exec与match方法相关推荐

php节点对象,JavaScript_JavaScript中访问节点对象的方法有哪些如何使用，JavaScript中访问节点对象的方法 - phpStudy...
JavaScript中访问节点对象的方法有哪些如何使用 JavaScript中访问节点对象的方法有哪些? var obj = document.getElementById('fdafda'); va ...
什么是在JavaScript中扩展错误的好方法？
本文翻译自:What's a good way to extend Error in JavaScript? I want to throw some things in my JS code and ...
在JavaScript中复制数组的最快方法-切片与“ for”循环
本文翻译自:Fastest way to duplicate an array in JavaScript - slice vs. 'for' loop In order to duplicate a ...
java中字符串和数组如何比较_[Java教程]javascript中数组和字符串的方法比较
[Java教程]javascript中数组和字符串的方法比较 0 2016-07-19 23:00:05 ×目录[1]可索引 [2]转换 [3]拼接[4]创建[5]位置前面的话字符串和数组有很多的 ...
JavaScript中的 inludes 和 indexOf 方法 | 判断字符串或数组中是否存在对应的元素| 相同点与不同点 | 代码详解
目录 JavaScript中的inludes和indexOf方法 1.数组中的includes和indexOf方法比较 1.1 函数返回值的不同 1.2 函数第二个参数--开始查找的位置 1.3 in ...
html escape函数,JavaScript中escape()函数的使用方法
导语:我们在传递参数时,为了避免服务器端出现乱码,常常会要用到编码函数,urlencode.HtmlEncode.base64_encode等.本文给大家详细讲解JavaScript中escape() ...
JavaScript中的类方法、对象方法、原型方法
类方法:也叫函数方法,在JavaScript中函数也是一个对象,所以可以为函数添加属性以及方法: 对象方法:包括构造函数中的方法以及其原型上面的方法: 原型方法:一般用于对象实例共享,在原型上面添加该 ...
JavaScript中md5加密基础使用方法
关于JavaScript中md5加密使用方法重点不说别的,先上代码,代码其实不难,更多需要理解 //这边是前端代码 <form class="loginForm" acti ...
javascript控制台_超越控制台日志3种在javascript中格式化控制台输出的方法
javascript控制台 As JavaScript developers, we intuitively use console.log() to debug, print out variabl ...

深入javascript中的exec与match方法

深入javascript中的exec与match方法相关推荐

最新文章

热门文章