js 正则 exec() 和 match() 数据抽取

转载地址：js 正则 exec() 和 match() 数据抽取去看看

js 的正则表达式平常用的不多，但以前抽取数据的时候用到过，主要是有这样的需求；

var text='<td class="data">2014-4-4</td><br /><td class="data">2014-4-5</td>';
//希望输出 ["2014-4-4", "2014-4-5"]

难倒不难，如何比较好的实现是个问题；

如果要提取其中的数据，主要就是 String 对象的 match()、replace()、split() 方法或者 RegExp 对象的 exec()，但是应用的时候，还是有点坑的；

首先写出正则，这个不难，一个非全局，一个全局：

var re = /<td[^>]*?>([\s\S]*?)<\/td>/,reg = /<td[^>]*?>([\s\S]*?)<\/td>/g;

但是匹配多个 <td></td> 的时候，match 方法有点特殊：

match 的特殊在于：

非全局正则，可以返回捕获组，也就是正则里面()里面的内容，但不能多次匹配；

全局正则，可以多次匹配，但不返回捕获组；

实际上，如果全局正则，多次匹配还返回捕获组的话，返回的数据就不可能是个简单数组了，因为 n 次匹配，m 个捕获组，那返回的结果就是，数组里有 n 个匹配结果，每个匹配结果里，还要放一个数组，用来表示每个捕获组的值；

如果换成 exec()，结果如下：

exec() 特殊在于：

不管正则是否加全局，返回的内容是一样的

具体实现：

1、这里，我们先用 match 实现一遍，按照前面的思路，就是用全局正则 match 一下，然后再遍历获取到的数组，通过非全局正则捕获我们要的东西：

text.match(reg).map(function(v) {return v.match(re)[1];
});
//返回 ["2014-4-4", "2014-4-5"]

比较好理解，但是需要两个正则，一个全局，一个非全局；

2、如果用 exec()，

var temp = [],data = [];
while ((temp = reg.exec(text)) !== null) {data.push(temp[1]);
}
//data:["2014-4-4", "2014-4-5"]

这样写的原因是，RegExp 对象的方法，经常有 lastIndex 的属性，exec() 在执行的时候，实际上每回只匹配一次，然后改了 lastIndex 属性的值为下一个开始的地方，然后下次从新的地方开始再匹配，如果匹配到末尾匹配不到了，返回 null ,举个例子：

这个特性不注意会被坑的，比如：

var reg=/ja/g,text='ja';
reg.test(text); //true reg.lastIndex 返回 2，其实也就是匹配到末尾了
reg.test(text); //false reg.lastIndex 返回 0，匹配到末尾没匹配到，返回 null,lastIndex 重置为 0；

参考资料：

JavaScript权威指南-第6版

JavaScript高级程序设计-第3版

行文仓促，如有错误，欢迎批评指正~~~
转载请注明来源，文中所提文档可以在我的 Github 上下载~~~

js 正则 exec() 和 match() 数据抽取相关推荐

前端开发：JS中exec()和match()的对比使用
前言在前端开发过程中,关于正则表达式的相关使用想必开发者并不陌生,而且也算是一个比较常用的知识点,尤其是在邮箱.手机号判断校验的时候是必备知识点,但是一般情况下遇到这种校验场景就是去找现有的正则表达 ...
js正则中的match()
在前端开发中,正则表达式是一大利器.所以我们这次就来讨论下match()方法. match本身是JavaScript语言中字符串对象的一个方法,该方法的签名是 match([string] | [Re ...
js正则表达exec和match的区别(转)
转自:http://blog.csdn.net/fushou/article/details/6934608 以前用js很少用到js的正则表达式,即使用到了,也是诸如邮件名称之类的判断,网上代码很多, ...
html js 数量正则,js正则匹配多个全部数据问题
需求:获取所有title里的内容正则表达式后面加g表示多次匹配方式一:match 返回数组方式二 exec var str='OOOT BAORJCT 174296 22mm 10yard/lo ...
浅谈 js 正则字面量与 new RegExp 执行效率
前几天谈了正则匹配 js 字符串的问题:<js 正则学习小记之匹配字符串> 和 <js 正则学习小记之匹配字符串优化篇>. 里面讲到了优化正则起到提升性能的问题,但是能提升多少 ...
js 正则验证数字（整数，货币型，浮点型）
本文章提供一款js 正则验证数字(判断是否为数字)哦,他可以验正整数,货币型,浮点型数据哦,也很好的验证了js判断是不是数字的代码哦. 货币型 function isvaliddecimal(char ...
js 正则中冒号代表什么_JS正则表达式一条龙讲解(从原理和语法到JS正则)
正则啊,就像一座灯塔,当你在字符串的海洋不知所措的时候,总能给你一点思路:正则啊,就像一台验钞机,在你不知道用户提交的钞票真假的时候,总能帮你一眼识别:正则啊,就像一个手电筒,在你需要找什么玩意的时候 ...
python正则提取mysql中文数据
要对mysql中的中文数据做正则匹配,就想用python,简单实用,不过碰到中文乱码问题,各种搜索,折腾了好久,总算解决了,基本上的原则就是转为utf8编码. 具体为从表中的"title&q ...
vue.js中mock本地json数据
vue.js中mock本地json数据新版本的vue项目中已经将dev-server.js,dev-client.js两个js文件合并到了webpack.dev.conf.js文件中,以下分别是新旧 ...
常用JS正则匹配函数
//校验用户名:只能输入1-30个字母 function isTrueName(s) { var patrn=/^[a-zA-Z]{1,30}$/; if (!patrn.exec(s)) retur ...

js 正则 exec() 和 match() 数据抽取

js 正则 exec() 和 match() 数据抽取相关推荐

最新文章

热门文章