स्ट्रिंग द्वारा ऑब्जेक्ट्स की ऐरे को सॉर्ट करना: JavaScript के लिए 5 तरीके

स्ट्रिंग प्रॉपर्टी द्वारा ऑब्जेक्ट्स की ऐरे को सॉर्ट करना: Stack Overflow के लोकप्रिय प्रश्न को समझना

कल्पना करें: आपके पास उपयोगकर्ताओं, उत्पादों या लेखों की एक सूची है। प्रत्येक आइटम एक ऑब्जेक्ट है जिसमें कई प्रॉपर्टी हैं: नाम, मूल्य, तिथि, रेटिंग। और आपको इन सबको, मान लीजिए, वर्णमाला क्रम में नाम के अनुसार सॉर्ट करना है। एक ऐसा कार्य जो सरल लगता है, लेकिन व्यवहार में आश्चर्य प्रस्तुत करता है। कोई आश्चर्य नहीं कि Stack Overflow पर प्रश्न "Sort array of objects by string property value" ने हज़ारों बार देखा गया और दर्जनों उत्तर प्राप्त किए।

इस लेख में, हम केवल तैयार कोड नहीं देंगे। हम सॉर्टिंग के 5 तरीकों पर चर्चा करेंगे, बुनियादी से लेकर उन्नत तक, सामान्य गलतियों की पहचान करेंगे और दिखाएंगे कि उनसे कैसे बचा जाए। अंत तक, आप किसी भी डेटा को आसानी से सॉर्ट कर सकेंगे।

JavaScript में ऑब्जेक्ट्स की ऐरे को सॉर्ट करना क्या है?

JavaScript में एक बिल्ट-इन मेथड है Array.prototype.sort()। लेकिन यह ऑब्जेक्ट्स के साथ स्पष्ट रूप से काम नहीं करता है। यदि बिना आर्गुमेंट के sort() को कॉल किया जाए, तो यह एलिमेंट्स की तुलना स्ट्रिंग के रूप में करने का प्रयास करेगा। संख्याओं के लिए, यह आश्चर्य देता है: [1, 20, 3].sort() [1, 20, 3] लौटाएगा, न कि [1, 3, 20]। ऑब्जेक्ट्स के लिए — पूर्ण अव्यवस्था।

इसलिए हमें एक तुलना फ़ंक्शन (comparator) की आवश्यकता है। यह दो एलिमेंट लेता है और लौटाता है:

\n
• एक ऋणात्मक संख्या, यदि पहला एलिमेंट दूसरे से छोटा है;
\n
• 0, यदि बराबर हैं;
\n
• एक धनात्मक संख्या, यदि पहला बड़ा है।
\n

यहाँ स्ट्रिंग प्रॉपर्टी द्वारा ऑब्जेक्ट्स की ऐरे को सॉर्ट करने की मूल संरचना है:

// मूल ऐरे\nconst users = [\n    { name: 'Иван', age: 25 },\n    { name: 'Анна', age: 30 },\n    { name: 'Борис', age: 22 }\n];\n\n// name फ़ील्ड द्वारा सॉर्ट करना\nusers.sort((a, b) => {\n    if (a.name < b.name) return -1;\n    if (a.name > b.name) return 1;\n    return 0;\n});\n\nconsole.log(users);\n// [{ name: 'Анна', age: 30 }, { name: 'Борис', age: 22 }, { name: 'Иван', age: 25 }]

यह कोड काम करता है, लेकिन यह भारी है। आइए देखें कि इसे और अधिक सुरुचिपूर्ण कैसे बनाया जाए।

स्ट्रिंग द्वारा ऑब्जेक्ट्स की ऐरे को सॉर्ट करने के 5 तरीके

तरीका 1: क्लासिक तुलना फ़ंक्शन

सबसे पारदर्शी तरीका। किसी भी स्ट्रिंग के लिए उपयुक्त, जिसमें सिरिलिक भी शामिल है, बशर्ते आप सही वर्णमाला क्रम का उपयोग करें। < और > के माध्यम से तुलना Unicode में वर्ण कोड को ध्यान में रखती है, जो रूसी भाषा के लिए अप्रत्याशित परिणाम देती है: 'ё' वर्णमाला के अंत में होगा, और 'я' 'а' के पास होगा।

const products = [\n    { title: 'Яблоко', price: 50 },\n    { title: 'Ёлка', price: 200 },\n    { title: 'Ананас', price: 150 }\n];\n\n// समस्या: 'Ёлка' 'Яблоко' के बाद आएगा\nproducts.sort((a, b) => {\n    if (a.title < b.title) return -1;\n    if (a.title > b.title) return 1;\n    return 0;\n});

कब उपयोग करें: अंग्रेजी स्ट्रिंग के लिए, जहाँ वर्णमाला क्रम Unicode से मेल खाता है।

तरीका 2: localeCompare — सिरिलिक का उद्धारकर्ता

मेथड String.prototype.localeCompare() किसी विशिष्ट भाषा के लिए सॉर्टिंग नियमों को ध्यान में रखता है। रूसी के लिए — 'ru' पास करें।

users.sort((a, b) => a.name.localeCompare(b.name, 'ru'));\n\nconsole.log(users);\n// [{ name: 'Анна', age: 30 }, { name: 'Борис', age: 22 }, { name: 'Иван', age: 25 }]

यह कोड साफ, छोटा है और 'ё', 'й' और अन्य अक्षरों को सही ढंग से संभालता है। यदि अवरोही क्रम में सॉर्ट करना है — तो बस a और b को बदल दें:

users.sort((a, b) => b.name.localeCompare(a.name, 'ru'));

कब उपयोग करें: हमेशा जब सिरिलिक या बहुभाषी डेटा के साथ काम कर रहे हों।

तरीका 3: केस-सेंसिटिव सॉर्टिंग

डिफ़ॉल्ट रूप से, localeCompare केस-सेंसिटिव है: 'apple' 'Banana' से पहले आएगा, क्योंकि लोअरकेस अक्षर का कोड छोटा होता है।