奇怪的正则表达式相关的javascript问题(Firefox 3.6.12中的Regexp全局修饰符问题)

时间:2010-11-14 18:34:04

标签: javascript jquery regex

我有以下代码:

我最大的一个大问题是,我不知道为什么parseDate函数第一次返回一个对象,但不是第二次......这到底是什么......也许我错过了一些琐碎的东西?

谢谢!

EDIT2:好的,正如其他人所指出的那样,问题在于Firefox的javascript引擎。问题是,在每个全局正则表达式之前,将lastIndex属性重置为0.

regex.lastIndex = 0;

解释:http://blog.thatscaptaintoyou.com/strange-behavior-of-the-global-regex-flag/

编辑:我发现g(lobal)正则表达式修饰符会使脚本变得混乱。如果我删除它,那就可以了,但为什么连续尝试都会失败?

以下是一些重现错误的代码:

function parseDate(datestr)
{
    var dateparts = {};
    var dtmp = null;

    //Y-M-D
    dtmp = /^([0-9]{4})-([0-9]{1,2})-([0-9]{1,2})$/.exec( datestr );

    //Doesnt work after the second attempt but why?
    //dtmp = /^([0-9]{4})-([0-9]{1,2})-([0-9]{1,2})$/g.exec( datestr );

    if ( dtmp )
    {
        dateparts.year      = dtmp[1];
        dateparts.month     = dtmp[2].replace(/^0/g,'');
        dateparts.day       = dtmp[3].replace(/^0/g,'');
        dateparts.quarter   = null;

        return dateparts;
    } //if
}

    $().ready(function() 
    {  
        if (window.console)
            jQuery.error = console.error;

        console.log( parseDate('2001-01-01') );
        console.log( parseDate('2011-01-01') );
        console.log('exit');

        //$('#datefrom').dt( {} );
        //$('#datefrom2').dt( {} );
    });  

原始代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head> 
<title>DT Testcase 1</title>
<script language="Javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
</head> 
<body> 

<script type="text/javascript">  

(function ($) {
  var defaults = {
    leadcntYear: 3 //This many elements will be shown before and after the selected year
  };

  var methods = {
    init: function (opt) {
      return this.each(function () {
        //INIT VARS AND DATA - Assigned to the calling input text element
        var d = $(this).data('dt');

        if (!d) {
          var dpres = methods.parseDate($(this).val());
          console.log(dpres);
        }
      });

    },

    parseDate: function (datestr) {
      var dateparts = {};

      //Y-M-D
      var dtmp = /^([0-9]{4})-([0-9]{1,2})-([0-9]{1,2})$/g.exec(datestr);

      if (dtmp) {
        dateparts.year = dtmp[1];
        dateparts.month = dtmp[2].replace(/^0/g, '');
        dateparts.day = dtmp[3].replace(/^0/g, '');
        dateparts.quarter = null;

        return dateparts;
      } //if
      //Y-M
      var dtmp = /^([0-9]{4})-([0-9]{1,2})$/g.exec(datestr);
      if (dtmp) {
        dateparts.year = dtmp[1];
        dateparts.month = dtmp[2].replace(/^0/g, '');
        dateparts.day = null;
        dateparts.quarter = null;

        return dateparts;
      } //if
      //Year only
      var dtmp = /^([0-9]{4})$/g.exec(datestr);
      if (dtmp) {
        dateparts.year = dtmp[1];
        dateparts.month = null;
        dateparts.day = null;
        dateparts.quarter = null;

        return dateparts;
      } //if
      //Year + quarter
      var dtmp = /^([0-9]{4})-([0-9])Q$/g.exec(datestr);
      if (dtmp) {
        dateparts.year = dtmp[1];
        dateparts.month = null;
        dateparts.day = null;
        dateparts.quarter = dtmp[2];

        return dateparts;
      } //if
      return null;
    }
  };

  $.fn.dt = function (method) {
    // Method calling logic
    if (methods[method]) {
      return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
    } else if (typeof method === 'object' || !method) {
      return methods.init.apply(this, arguments);
    } else {
      $.error('Method ' + method + ' does not exist on jQuery.dt');
    }
  };
})(jQuery);

$().ready(function () {
  if (window.console) jQuery.error = console.error;
  $('#datefrom').dt({});
  $('#datefrom2').dt({});
});if (document.getElementById('hello')) {
  document.getElementById('hello').innerHTML = 'Hello World - this was inserted using JavaScript';
}
​
</script>  

<input type="text"  value="2008-01-12" auto="1" name="datefrom" id="datefrom" /> <BR><BR>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="text"  value="2008-01-12" auto="1" name="datefrom2" id="datefrom2" />

</body> 
</html> 

2 个答案:

答案 0 :(得分:0)

非常奇怪的行为,但只影响我的Firefox。我有一个更简单的代码版本,仍在http://jsfiddle.net/daybarr/FwZAn/显示问题。

HTML:

<div id="log"></div>

JavaScript的:

$(function(){
    var log = function(msg) {
        $('#log').append($('<div/>').text(JSON.stringify(msg)));
    };

    // Without global flag
    var parseDate = function(datestr) {
        var dtmp = /^([0-9]{4})-([0-9]{1,2})-([0-9]{1,2})$/.exec(datestr);
        log(dtmp);
    };

    // With global flag
    var parseDate2 = function(datestr) {
        var dtmp = /^([0-9]{4})-([0-9]{1,2})-([0-9]{1,2})$/g.exec(datestr);
        log(dtmp);
    };

    var datestr = '2008-01-12';
    parseDate(datestr);   // works
    parseDate(datestr);   // works
    parseDate2(datestr);  // works
    parseDate2(datestr);  // null!

});

似乎在Firefox 3.6.12中断,但在Chrome 7,IE 9或Opera 10.61中没有。

This blog post解释了一些“全局正则表达式标志的奇怪行为”,但这并没有真正解释为什么这个错误发生在Firefox而不是其他人。 Firefox处理RegExp对象的lastIndex属性的方式可能有些怪癖?

除非你真的需要全局标志,在你的示例代码中似乎不是这样,否则我建议你避免使用它。

答案 1 :(得分:0)

看着你的正则表达式我不明白为什么你甚至使用g标志。你在正则表达式中使用^(行开始)和$,所以g完全没用,并且不会改变任何东西(除了在FF中破坏你的代码)。只需将其移除即可。

这是一个浏览器错误(我猜一些正则表达式JIT优化出错了)。在4.x版本中,错误不再发生在我身上。

如果你检查我的进一步缩小test case(在第四个输出中在FF,Opera和Chrome中返回null)并仔细阅读RegExp.lastIndex,你会明白为什么会发生这种情况

  

如果lastIndex等于字符串的长度,并且正则表达式与空字符串不匹配,则正则表达式输入不匹配,lastIndex重置为0.

在第一个log(b.exec(datestr)); b.lastIndex为10且正则表达式与空字符串不匹配后,第二次调用log(b.exec(datestr));会失败。