Grep против фильтра в jQuery?

Мне было интересно узнать о различиях между Grep и Filter:

Фильтр:

Сократите набор совпадающих элементов до тех, которые соответствуют селектору, или пройдете проверку функции.

Grep:

Находит элементы массива, удовлетворяющие функции фильтрации. Исходный массив не изменяется.

Хорошо.

поэтому, если я сделаю это в 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);
});

В обеих ситуациях я все еще могу получить доступ к исходному массиву ...

так ... в чем разница?

Они оба функционируют одинаково, но по-разному используются.

Функция фильтра предназначена для использования с элементами html, и именно поэтому она представляет собой цепную функцию, которая возвращает объект jQuery и принимает такие фильтры, как «: даже», «: нечетный» или «: видимый» и т. Д. Сделайте это с помощью функции grep, которая предназначена для работы с массивами.

Фильтр является частью jQuery.fn, поэтому его цель - использовать с селектором, $('div').filterгде grep - это метод инструмента jQuery ( jQuery.grep)

Разница в его использовании:

Фильтр:

$(selector).filter(selector/function)

Grep:

$.grep(array,function,invert)

Так что в вашем случае я предпочел бы использовать , grep()потому что с помощью массива таким образом , не является необходимым: $(arr).

Я также предполагаю, что эта grepфункция быстрее, потому что она принимает только массивы.

Для тех, кто заинтересован в том , как grepвыполняет против filterI написал этот тест:

TL; DR; 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>

@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>

TL; DR: в firefox фильтр работает немного быстрее, в хроме все наоборот. Что касается только выступлений, вы можете использовать кого угодно.