jQuery 中的 Grep 与过滤器?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/10139916/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Grep vs Filter in jQuery?
提问by Royi Namir
I was wondering about the differences between Grep and Filter :
我想知道 Grep 和 Filter 之间的区别:
Filter :
筛选 :
Reduce the set of matched elements to those that match the selector or pass the function's test.
将匹配元素集减少到与选择器匹配或通过函数测试的元素集。
Grep :
格雷普:
Finds the elements of an array which satisfy a filter function. The original array is not affected.
查找满足过滤器函数的数组元素。原数组不受影响。
ok.
好的。
so if I do this in 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);
});
I could do also :
我也可以:
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);
});
In both situations I still can access to the original array...
在这两种情况下,我仍然可以访问原始数组...
so...where is the difference ?
所以……区别在哪里?
回答by omerkirk
They both function in similar ways however they differ in their usages.
它们都以相似的方式运行,但它们的用法不同。
The filter function is intended to be used with html elements, and that is why it is a chainable function that returns a jQuery object and it accepts filters like ":even", ":odd" or ":visible" etc. You can't do that with the grep function, which is intended to be a utility function for arrays.
filter 函数旨在与 html 元素一起使用,这就是为什么它是一个可链接的函数,它返回一个 jQuery 对象并且它接受像 ":even"、":odd" 或 ":visible" 等过滤器。你可以'用 grep 函数来做这件事,它旨在成为数组的实用函数。
回答by GillesC
Filter is part of jQuery.fn so it's aim is to be used with selector $('div').filter
where grep is a jQuery tool method (jQuery.grep
)
过滤器是 jQuery.fn 的一部分,因此它的目标是与选择器一起使用,$('div').filter
其中 grep 是 jQuery 工具方法 ( jQuery.grep
)
回答by GillesC
The difference in its usage:
它的用法区别:
Filter:
筛选:
$(selector).filter(selector/function)
$(selector).filter(selector/function)
Grep:
格雷普:
$.grep(array,function,invert)
$.grep(array,function,invert)
So in your case I would rather use grep()
because using array this way is unnecessary: $(arr)
.
所以你的情况,我宁愿使用grep()
,因为使用数组这种方式是不必要的:$(arr)
。
I also suppose that grep
function is faster, because it only accepts arrays.
我还认为该grep
函数更快,因为它只接受数组。
回答by Matas Vaitkevicius
To those that are interested on how grep
performs against filter
I wrote this test:
对于那些grep
对filter
我写了这个测试的表现感兴趣的人:
TLDR;Grep is many times faster.
TLDR;Grep 要快很多倍。
Script I used for testing:
我用于测试的脚本:
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>
回答by Pierre Bonhoure
@Matas Vaitkevicius, the code snippet posted presents errors, here is a corrected one:
@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 :In firefox, filter is slightly faster, in chrome, that's the opposite. Regarding performances only, you can use anyone.
TLDR :在 firefox 中,过滤器稍微快一点,在 chrome 中,情况正好相反。仅关于表演,您可以使用任何人。