16

これら2つの関数の実行時間を測定しました。

次のメソッドの実行は、Chromeプロファイルツールを使用して測定されています。

// jQuery GREP function
function alternative1(words, wordToTest) {
  return $.grep(words, function(word) {
    return wordToTest.indexOf(word) != -1;                    
  });
}

// Native javascript FILTER function        
function alternative2(words, wordToTest) {
  return words.filter(function(word) {
    return wordToTest.indexOf(word) != -1;                    
  });
}

の配列は、wordsランダムに生成された100万個の文字列で構成されています。各メソッドは20回実行されました。驚いたことに、jQuerygrep関数の方が高速でした。

実行時間（20回の実行）：

このjsFidleで測定を繰り返すことができます。実行には時間がかかるため、しばらくお待ちください。

jQuery grep関数がネイティブJavaScriptフィルター関数よりも高速である理由について何か説明はありますか？

PS：この質問は、この回答に触発されました。

4

1 に答える 1

13

$.grepページで実際に使用されているjQuery関数を比較する

function (a, b, c) {
    var d = [],
        e;
    c = !! c;
    for (var f = 0, g = a.length; f < g; f++) e = !! b(a[f], f), c !== e && d.push(a[f]);
    return d
}

（縮小されていない場合はここをチェックしてください、 Alexanderに感謝します）

Array.prototype.filter。

私には、それをObject.filterに強制し、コールバックとセットをチェックし、各反復でプロパティの存在をチェックするように見えますが、これらのステップを想定してスキップするため、進行がわずかに少なくなります。thisIsCallablethis.grep

これをChromeのJavaScriptコンパイラがどれほど優れているかと組み合わせると、速度の違いが見つかる可能性があります。

これらのいくつかをに追加すると、次の$.grepようになります。

function (elems, callback, inv, thisArg) {
    var ret = [],
        retVal;
    inv = !!inv;
    for (var i = 0, length = elems.length; i < length; i++) {
        if (i in elems) { // check existance
            retVal = !!callback.call(thisArg, elems[i], i); // set callback this
            if (inv !== retVal) {
                ret.push(elems[i]);
            }
        }
    }
    return ret;
}

.filter （変更されたAlexanderのjsperf）とほぼ同じ時間がかかります。

于 2012-12-30T13:37:44.147 に答える