JavaScript 正则表达式在单词 "tennis"上神秘失败

Question

我们用 JavaScript 编写了一个小脚本来查找重复项或潜在重复项。该脚本有时有效，但在某些单词(例如“网球”)上却神秘地失败了。我们正在使用 jQuery。

步骤:

1) 单击此处的 JSFiddle 演示:http://jsfiddle.net/6Hgex/ .

2) 点击检查欺骗。

3) 在重复单词部分下，单词网球应列出两个条目，一个用于观看网球比赛，另一个用于观看网球比赛>发球。然而，由于某种原因，正则表达式在检查发球短语时会失败 - 除非我们使用 Chrome 开发者工具替换变量和硬代码值。当我们使用断点时，所有值看起来都是正确的，但正则表达式对此短语失败。

知道我们做错了什么吗？

谢谢!

JavaScript:

    // Init page
    $( document ).ready( function() {
        init();
    });


    function init() {
        $( '#box .button.dupe_clues' ).on( 'mousedown', function() {
            var dupe_words_list = $( '.list.dupe_words' );
            dupe_words_list.empty();
            var dupe_words = ['tennis'];
            var unique_clues = ['watching tennis match', 'serving tennis ball'];
            $( dupe_words ).each( function() {
                var highlighted_clues = highlight_dupe_word( unique_clues, this );
                dupe_words_list.append( '<div>' + this + ': ' + highlighted_clues + '</div>' );
            });
        });
    }


function highlight_dupe_word( clues, word ) {
    var list = '';

    // Find all clues containing this word
    var escaped_word = word.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&');
    var re = new RegExp( '\\b' + escaped_word + '\\b', 'gi' );
    $( clues ).each( function(i, text) {
        if ( re.test( text ) ) {
            list = list + ', ' + text;
        }
    });

    // Trim leading comma
    if ( list.length > 0 ) {
        list = list.substring( 2, list.length + 1 );
    }

    // Return list
    return ( list );
}

HTML:

<div id='box'>
    <textarea id='clues'>
                 watching tennis match
                 serving tennis ball       
    </textarea>

    <div class='button_box'>
        <div class='button dupe_clues'>Check Dupes</div>
    </div>


    <div class='results'>
        <div class='title'>Safe Clues</div>
        <div class='unique_clues list'></div>
        <div class='title'>Repeat Words</div>
        <div class='dupe_words list'></div>
        <div class='title'>Dupe Clues</div>
        <div class='dupe_clues list'></div>
    </div>
</div>

Answer 1

不要使用g标志。

var re = new RegExp( '\\b' + escaped_word + '\\b', 'i' );

g 标志使 RegExp 对象记住其位置，并在再次调用 test() 时从那里恢复搜索。在您的情况下，每个调用都应从字符串的开头开始。