jQueryのGrepとフィルター？

Question 1

GrepとFilterの違いについて疑問に思っていました：

フィルター：

一致する要素のセットを、セレクターに一致する要素または関数のテストに合格する要素に減らします。

Grep：

フィルタ関数を満たす配列の要素を検索します。元の配列は影響を受けません。

OK。

したがって、GREPでこれを行うと：

var arr = [ 1, 9, 3, 8, 6, 1, 5, 9, 4, 7, 3, 8, 6, 9, 1 ];

myNewArray= jQuery.grep(arr, function(n, i){
  return (n != 5 && i > 4);
});

私もすることができます：

 var arr = [ 1, 9, 3, 8, 6, 1, 5, 9, 4, 7, 3, 8, 6, 9, 1 ];

myNewArray= $(arr).filter( function(n, i){
  return (n != 5 && i > 4);
});

どちらの状況でも、元のアレイにアクセスできます...

だから...違いはどこにありますか？

Question 2

どちらも同じように機能しますが、使用法が異なります。

フィルタ関数はhtml要素で使用することを目的としているため、jQueryオブジェクトを返すチェーン可能な関数であり、「：even」、「：odd」、「：visible」などのフィルタを受け入れます。これは、配列のユーティリティ関数として使用することを目的としたgrep関数を使用して行います。

Question 3

フィルタはjQuery.fnの一部であるため$('div').filter、grepがjQueryツールメソッドであるセレクターで使用することを目的としています（jQuery.grep）

Question 4

その使用法の違い：

フィルタ：

$(selector).filter(selector/function)

Grep：

$.grep(array,function,invert)

したがって、あなたの場合、grep()このように配列を使用する必要がないので、私はむしろ使用したいと思います$(arr)。

また、grep関数は配列しか受け入れないため、より高速だと思います。

Question 5

私がこのテストをどのようにgrep実行するかに興味がある人にfilter：

TLDR; Grepは何倍も高速です。

テストに使用したスクリプト：

function test(){
var array = [];
for(var i = 0; i<1000000; i++)
{
array.push(i);
}

var filterResult = []
for (var i = 0; i < 1000; i++){
var stime = new Date();
var filter = array.filter(o => o == 99999);
filterResult.push(new Date() - stime);
}

var grepResult = [];
var stime = new Date();
var grep = $.grep(array,function(i,o){
return o == 99999;
});
grepResult.push(new Date() - stime);

$('p').text('average filter - '+(filterResult.reduce((pv,cv)=>{ return pv +cv},0)/1000))
$('div').text('average grep - '+(grepResult.reduce((pv,cv)=>{ return pv + cv},0)/1000))
}
test();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<p></p>
<div></div>

スニペットを展開

Question 6

@Matas Vaitkevicius、投稿されたコードスニペットはエラーを示します。修正されたものは次のとおりです。

function test(){
var array = [];
for(var i = 0; i<1000000; i++)
{
    array.push(i);
}

var filterResult = []
for (var i = 0; i < 1000; i++){
    var stime = new Date();
    var filter = array.filter(o => o == 99999);
    filterResult.push(new Date() - stime);
}

var grepResult = [];
for (var i = 0; i < 1000; i++){
    var stime = new Date();
    var grep = $.grep(array,function(i,o){
        return o == 99999;
    });
    grepResult.push(new Date() - stime);
}

$('p').text('average filter - '+(filterResult.reduce((pv,cv)=>{ return pv +cv},0)/1000))
$('div').text('average grep - '+(grepResult.reduce((pv,cv)=>{ return pv + cv},0)/1000))
}
test();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<p></p>
<div></div>

スニペットを展開

TLDR： Firefoxでは、フィルターはわずかに高速ですが、Chromeではその逆です。公演のみ、どなたでもご利用いただけます。