jQuery .hasClass () बनाम .is ()

Question

क्या यह निर्धारित करने का एक पसंदीदा तरीका है कि क्या एक तत्व को एक वर्ग सौंपा गया है, प्रदर्शन के दृष्टिकोण से?

$('#foo').hasClass('bar');

या

$('#foo').is('.bar');

Comments

आप हमेशा इस साइट के साथ-साथ कई ब्राउज़रों पर प्रदर्शन को मान्य कर सकते हैं: jsperf.com ... ये ब्राउज़ करने के लिए कुछ परीक्षण मामले हैं: jsperf.com/browse

— iwasrobbed

Answer 1

अपडेट करें:

मैंने एक टिप्पणी के बाद एक परीक्षण किया और बहुत टिप्पणी करने के लिए चार upvotes। यह पता चला है कि मैंने जो कहा था वह सही उत्तर है। यहाँ परिणाम है:

http://jsperf.com/hasclass-vs-is-so

---

यह isबहुउद्देश्यीय है, आप उदाहरण के लिए is('.class'), is(':checked')आदि कर सकते हैं , जिसका अर्थ isहै कि ऐसा अधिक है जहाँ hasClassसीमित है जो केवल एक वर्ग के सेट या नहीं की जाँच करता है।

इसलिए, hasClassकिसी भी स्तर पर प्रदर्शन आपकी प्राथमिकता है, तो तेजी से होना चाहिए।

Comments

क्या आपके पास सबूत है कि यह तेज है? सिर्फ इसलिए कि एक फ़ंक्शन में कम फ़ंक्शनलिटी है इसका मतलब यह नहीं है कि यह स्वचालित रूप से तेज़ है।

— क्रिश

@ क्रिस: हां मैं करता हूं: jsperf.com/hasclass-vs-is-so । जैसा कि मैंने कहा, hasClass है एक बहुत अधिक तेजी से।

— सरफराज

'बहुत अधिक तेज' => 'बहुत तेज'

— कर्क स्ट्रोबेक

@SgtPooki, मैं केवल प्रमाण के लिए पूछ रहा था; अगर यह सच था तो मैं जानना चाहता था कि क्यों। मैं उस तरह जिज्ञासु हूं :)। आपके पास आसानी से अधिक कार्यक्षमता हो सकती है और यह तेज़ हो सकता है; यह हमेशा कार्यान्वयन पर निर्भर करता है। आपका 99% एक व्यापक सामान्यीकरण है और जरूरी नहीं कि सॉफ्टवेयर विकास की सही स्थिति हो। आपका प्रश्न "jQuery कभी सीधा जावास्क्रिप्ट के रूप में तेजी से होगा? कोई जवाब नहीं के अलावा एक गलत है।" अच्छा सवाल नहीं है; jQuery के पास वास्तव में कई अनुकूलन हैं, जिसमें डेटा के कैश होने के बाद DOM तत्वों तक तेजी से पहुँच प्रदान करेगा; यह वास्तव में आपके विशिष्ट उपयोग पर निर्भर करता है।

— क्रिश

@SgtPooki जहां तक ​​तेजी से sizzle चयनकर्ता इंजन पर एक नज़र रखना; जैसा कि मैंने उल्लेख करना जारी रखा है यह कार्यान्वयन पर निर्भर करता है और पुराने ब्राउज़रों में जो मूल रूप से प्रश्नों का समर्थन नहीं करते हैं, यह सबसे अधिक संभावना है कि jQuery के कार्यान्वयन के माध्यम से तेजी से होगा क्योंकि कोई मूल संस्करण नहीं है (डिफ़ॉल्ट रूप से जीतें)। यदि आप ब्राउज़र और संस्करण के आधार पर समान DOM तत्वों को याद करना जारी रखते हैं, तो भी अतिरिक्त समय लग सकता है जहाँ jQuery इस तत्व को तेजी से पुनर्प्राप्ति के लिए कैश कर सकता है। आमतौर पर देशी जावास्क्रिप्ट फ़ंक्शंस तेज़ होंगे; लेकिन यह ब्राउज़र समर्थन और कार्यान्वयन पर निर्भर करता है।

— क्रिश

Answer 2

के बाद से isअधिक से अधिक सामान्य है hasClassऔर उपयोग करता है filterप्रदान की अभिव्यक्ति पर कार्रवाई करने के, यह संभावना है कि लगता हैhasClass है तेजी से।

मैंने फायरबग कंसोल से निम्न कोड चलाया:

function usingIs() {
for (var i=0; i<10000;i++) {
 $('div#example-0').is('.test');
}
}

function usingHas(){
for (var i=0; i<10000;i++) {
 $('div#example-0').hasClass('test');
}
}

usingIs();
usingHas();

मुझे मिला:

• usingIs: 3191.663ms
• useHas: 2362.523ms

बहुत बड़ा अंतर नहीं है, लेकिन यदि आप बहुत कुछ कर रहे हैं तो प्रासंगिक हो सकता है परीक्षण ।

EDIT जब मैं कहता हूं कि कोई बहुत बड़ा अंतर नहीं है, तो मेरा कहना यह है कि आपको 0.8 के अंतर को देखने के लिए 10000 चक्र करने की आवश्यकता है। मैं एक वेब एप्लिकेशन को देखकर आश्चर्यचकित रहूंगा, जिसमें से स्विच isकरने hasClassसे सभी प्रदर्शनों में महत्वपूर्ण सुधार होगा। हालांकि, मैं अनुदान देता हूं कि यह गति में 35% सुधार है।

Answer 3

दोनों को प्रदर्शन के मामले में काफी करीब होना चाहिए, लेकिन $('#foo').hasClass('bar');अधिक पठनीय और शब्दार्थ से मुझे सही लगता है।

Answer 4

.hasClassबहुत तेजी से .is आप इसे यहाँ से परीक्षण कर सकते हैं । अपने अनुसार टेस्ट केस बदलें।