JQuery में Grep बनाम फ़िल्टर?

Question 1

मैं Grep और फ़िल्टर के बीच अंतर के बारे में सोच रहा था:

फ़िल्टर:

चयनकर्ताओं से मिलान करने वाले तत्वों के सेट को कम करें जो चयनकर्ता से मेल खाते हैं या फ़ंक्शन का परीक्षण पास करते हैं।

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);
});

दोनों स्थितियों में मैं अभी भी मूल सरणी तक पहुँच सकता हूँ ...

तो ... अंतर कहां है?

Question 2

वे दोनों समान तरीकों से कार्य करते हैं हालांकि वे अपने उपयोग में भिन्न होते हैं।

फ़िल्टर फ़ंक्शन का उपयोग html तत्वों के साथ किया जाना है, और यही कारण है कि यह एक चेनेबल फ़ंक्शन है जो एक jQuery ऑब्जेक्ट देता है और यह ": सम", ": विषम" या ": दृश्यमान" आदि जैसे फ़िल्टर स्वीकार कर सकता है। t कि grep फ़ंक्शन के साथ ऐसा करें, जिसका उद्देश्य सरणियों के लिए एक उपयोगिता फ़ंक्शन है।

Question 3

फ़िल्टर jQuery.fn का हिस्सा है, इसलिए इसका उद्देश्य चयनकर्ता के साथ प्रयोग किया जाना है $('div').filterजहाँ grep एक jQuery उपकरण विधि है jQuery.grep)

Question 4

इसके उपयोग में अंतर:

फिल्टर:

$(selector).filter(selector/function)

ग्रेप:

$.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

@ माटस वैतकेविसियस, कोड स्निपेट पोस्ट त्रुटियों को प्रस्तुत करता है, यहाँ एक सही है:

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: फ़ायरफ़ॉक्स में, क्रोम में फ़िल्टर थोड़ा तेज़ होता है, यह विपरीत है। केवल प्रदर्शन के बारे में, आप किसी का भी उपयोग कर सकते हैं।