JavaScript正则库：XRegExp

jopen 9年前

好像网上介绍JS正则库的文章不多，可能也是因为复杂的正则匹配很少需要在客户端运行，所以JS上用的不多，并且我搜JS的正则库还真没找到第二个，囧。但它的一些特性挺实用，有兴趣的同学可以看看。由于没花太多时间去琢磨，所以本文只将该库作简要介绍，本文用例全部来自它的API文档。

XRegExp是一个为JS的正则表达式提供扩展功能的库， 调用之后可以弥补原生JS在正则方面的一些不足，也在很大程度上增强了JS正则的功能。它解决了浏览器之间正则的兼容问题，且支持原生ES6正则语法(有关ES6中正则的新特性：参考New regular expression features in ECMAScript 6)

XRegExp的压缩版大概4.25K，在性能上，由于XRegExp生成的正则都是原生的正则对象，其表现跟原生正则一样， 只是在首次创建XRegExp正则的时候需要多点开销。它的主要特点如下：

XRegExp的主要特性

  • 扩展的正则语法，包括支持命名的捕获组以及更强大的文本替换

  • 增加修饰符(flags)s支持单行模式；x忽略空格以及行注释；n明确捕获组模式；A支持21位Unicode匹配

  • 提供一套函数简化正则处理

  • 解决跨浏览器的正则兼容问题

  • 在此基础上提供扩展(addons)支持更多的正则语法和功能

基本用法

XRegExp的最主要的API也就是这个构造函数XRegExp(pattern, [flags])其语法如下：

  • pattern参数为字符型的正则表达式

  • [flags]为可选的正则修饰符，当然也是字符型，它支持原生的修饰符以及XRegExp中的扩展修饰符(特性中已列出)

返回值为被扩展的正则对象。

比如： 

// 使用了‘x’修饰符，所以忽略空格且支持行注释  //忽略空格指的是正则中的空格被忽略  //(?<name>…)这种写法即命名的捕获组  // #...为行注释  var date = XRegExp('(?<year>  [0-9]{4} ) -?  # year  \n\                      (?<month> [0-9]{2} ) -?  # month \n\                      (?<day>   [0-9]{2} )     # day   ', 'x');    //这里使用了XRegExp扩展的exec()方法  var match = XRegExp.exec('2015-02-22', date);  match.year; // -> '2015'

以上这个栗子就体现了XRegExp在正则上强大的扩展功能，比如命名的捕获组，正则注释等，这从一定程度上弥补了原生JS正则上的不足。

有趣的特性

由于我并没有看完它的所有API文档， 也是刚接触这玩意，所以这里只挑几个我觉得比较实用的特性列举。

迭代器forEach

它的语法格式为XRegExp.forEach(str, regex, callback)

  • str 被匹配的字符串

  • regex 传入的正则

  • 回调函数，该方法每次迭代将传入回调函数4个参数

    • 当前匹配的数组，并且带命名的后向引用属性

    • 当前匹配的索引位置

    • 正在被遍历的字符串

    • 正在使用的正则对象

    </li> </ul>

    该方法遍历被匹配的字符串，忽略其中正则全局修饰符g，也忽略lastIndex的初始值。
    该方法无返回值。
    例如： 

    // 从被匹配的字符串中每次抽取一个数字放入偶数数组  var evens = [];  XRegExp.forEach('1a2345', /\d/, function (match, i) {    if (i % 2) evens.push(+match[0]);  });  // evens -> [2, 4]

    匹配链方法matchChain

    匹配链方法可以从之前的匹配结果中调用下一个正则继续匹配，就像从一个大范围中使用不同的正则不断筛选出你要的数据。
    它的语法是XRegExp.matchChain(str, chain)

    • str 被匹配字符串

    • 一个正则组成的数组，比如[reg1，reg2，...]

    该方法返回与匹配链条(正则数组)最后一个正则的匹配内容，或一个空数组。
    例如： 

    // 基本用法：抽取每个<b>标记包裹的数字  //(?is)是XRegExp中修饰符前置的语法，它等同于在正则后加修饰符i s  XRegExp.matchChain('1 <b>2</b> 3 <b>4 a 56</b>', [    XRegExp('(?is)<b>.*?</b>'),    /\d+/  ]);  // -> ['2', '4', '56']      // 返回命名的捕获组内容(后部引用)  html = '<a href="http://xregexp.com/api/">XRegExp</a>\          <a href="http://www.google.com/">Google</a>';  XRegExp.matchChain(html, [    {regex: /<a href="([^"]+)">/i, backref: 1},    {regex: XRegExp('(?i)^https?://(?<domain>[^/?#]+)'), backref: 'domain'}  ]);  // -> ['xregexp.com', 'www.google.com']

    正则合并方法union

    该方法可以将需要匹配的字符串或者正则表达式合并为一个正则表达式，带后部引用的正则在合并时将被重新编码，其语法格式为XRegExp.union(patterns, [flags])

    • patterns为一个数组，数组元素可以是要匹配的字符串或正则

    • 可选的修饰符flags

    返回值为合并后的正则表达式。
    例如： 

    XRegExp.union(['a+b*c', /(dogs)\1/, /(cats)\1/], 'i');  // -> /a\+b\*c|(dogs)\1|(cats)\2/i

    大致先写这么多，还有什么使用21位unicode匹配表情符也蛮好玩的，再看到什么更好玩的继续补上吧。
    以上内容主要还是大致翻译API原文加上我自己的一些理解，这篇介绍都很简略，看着可能有点不太清楚，如有什么错漏还请指出。查看更详细的资料或者下载直接去它的主页吧。
    XRegExp的主页：XRegExp Github ：XRegExp 3.0.0

    来自：http://segmentfault.com/a/1190000004141584