JavaScript性能 - .test()vs .search()

Rus*_*sti 2 javascript performance jquery

如果我需要查看字符串中是否存在某个值,那么使用.test()方法或.search()方法的性能是否更好?

.search()示例:

var myRegExp = '/Orange/',
    myString = 'This is a string with the word "Orange."';

if(myString.search(myRegExp) != -1) {
    // Do code here
}
Run Code Online (Sandbox Code Playgroud)

.test()示例:

var myRegExp = '/Orange/',
    myString = 'This is a string with the world "Orange."';

if(myRegExp.test(myString)) {
    // Do code here
}
Run Code Online (Sandbox Code Playgroud)

最终,我正在做的是在字符串中搜索特定的类名.该元素将包含多个类,因此我需要查找其中一个类是否在其中.

示例标记:

<ul>
    <li class="expandable expanded">
        <ul>
            <li>Text</li>
        </ul>
    <li>
    <li class="expandable collapsed">
        <ul>
            <li>Text</li>
        </ul>
    </li>
</ul>
Run Code Online (Sandbox Code Playgroud)

所以,我在列表项中添加了一个click事件,如果它们的类名称为"expanded",则需要以一种方式运行,如果它们的类名称为"collapsed",则需要表现另一种.

所以,基本上,这样的事情.

element.addEventListener('click',function(e) {
    if( /* e.target has class name of expanded */ ) {
        // Do certain code
    } else {
        // Do other code
    }
}
Run Code Online (Sandbox Code Playgroud)

我正在使用jQuery,我对建议持开放态度,但我觉得这种情况可以通过原生javascript更好地服务.那么,哪种方法可以提供最佳性能?或者还有另一种方法会更好吗?

lon*_*day 5

好吧,如果你使用jQuery,你可以简单地使用

element.addEventListener('click',function(e) {
    if( $(e.target).hasClass('expanded' ) {
        // Do certain code
    } else {
        // Do other code
    }
}
Run Code Online (Sandbox Code Playgroud)

如果你不想出于任何原因(例如性能)创建一个jQuery对象,你可以使用这个函数,改编自$().hasClass():

function hasClass ( el, selector ) {
    var className = " " + selector + " ";

    if ( (" " + el.className + " ").replace(/[\n\t]/g, " ").indexOf( className ) > -1 ) {
        return true;
    }

    return false;
}
Run Code Online (Sandbox Code Playgroud)

然后您可以这样调用:

if ( hasClass(e.target, 'expanded') ) {
Run Code Online (Sandbox Code Playgroud)

就个人而言,如果你已经加载了jQuery方法,我会选择它.

  • jQuery和纯JS解决方案之间的比较:http://jsperf.com/pure-js-hasclass-vs-jquery-hasclass @Josh这个函数与jQuery hasClass函数不同 - 它不需要jQuery选择器对象. (2认同)