जावास्क्रिप्ट में ऑब्जेक्ट को कैसे पुनरावृत्त करें: उदाहरणों के साथ 5 तरीके

शुरुआती लोगों के लिए ऑनलाइन Python प्रशिक्षक

Python आसानी से सीखें बिना सिद्धांत के बोझ के। स्वचालित जांच के साथ व्यावहारिक कार्य हल करें और ब्राउज़र में सीधे कोड लिखें।

पाठ्यक्रम शुरू करें

जावास्क्रिप्ट में ऑब्जेक्ट को कैसे पुनरावृत्त करें: शुरुआती से विशेषज्ञ तक

\n\n

हर डेवलपर को कभी न कभी इस कार्य का सामना करना पड़ता है: "मैं किसी ऑब्जेक्ट के सभी गुणों पर कैसे जाऊं?" यह प्रश्न इतना लोकप्रिय है कि Stack Overflow पर इसने हज़ारों बार देखे जाने और सैकड़ों उत्तर प्राप्त किए हैं। और कोई आश्चर्य नहीं — जावास्क्रिप्ट में ऑब्जेक्ट सब कुछ का आधार हैं: कॉन्फ़िगरेशन से लेकर सर्वर से डेटा तक।

\n\n

इस ट्यूटोरियल में हम जावास्क्रिप्ट में ऑब्जेक्ट को पुनरावृत्त करने के सभी मुख्य तरीकों पर चर्चा करेंगे, क्लासिक से लेकर आधुनिक तरीकों तक। आप जानेंगे कि for...in का उपयोग कब करें, Object.keys किस तरह बेहतर है, और Object.entries जीवन को कैसे सरल बनाता है। चलिए शुरू करते हैं!

\n\n

तैयारी: एक परीक्षण ऑब्जेक्ट बनाना

\n\n

उदाहरणों को स्पष्ट बनाने के लिए, एक सरल उपयोगकर्ता ऑब्जेक्ट लेते हैं:

\n\n

const user = {\n  name: 'अन्ना',\n  age: 28,\n  city: 'मॉस्को',\n  isAdmin: false\n};

\n\n

हमारा कार्य सभी कुंजियाँ और मान प्रदर्शित करना है। आइए देखें कि जावास्क्रिप्ट के शस्त्रागार में कौन से उपकरण हैं।

\n\n

1. for...in लूप — क्लासिक तरीका

\n\n

ऑब्जेक्ट के गुणों को पुनरावृत्त करने का सबसे पुराना और बुनियादी तरीका। यह ES3 में ही आया था और सभी ब्राउज़रों में काम करता है।

\n\n

for (let key in user) {\n  console.log(key + ': ' + user[key]);\n}\n// name: अन्ना\n// age: 28\n// city: मॉस्को\n// isAdmin: false

\n\n

एक महत्वपूर्ण बारीकी: for...in न केवल अपने गुणों को, बल्कि प्रोटोटाइप के माध्यम से विरासत में मिले गुणों को भी पुनरावृत्त करता है। उन्हें फ़िल्टर करने के लिए, hasOwnProperty का उपयोग करें:

\n\n

for (let key in user) {\n  if (user.hasOwnProperty(key)) {\n    console.log(key + ': ' + user[key]);\n  }\n}

\n\n

आधुनिक ऑब्जेक्ट में शायद ही कभी अतिरिक्त प्रोटोटाइप गुण होते हैं, लेकिन hasOwnProperty की जाँच करने की आदत लाइब्रेरीज़ के साथ काम करते समय बग से बचाएगी।

\n\n

2. Object.keys() — आधुनिक दृष्टिकोण

\n\n

Object.keys() विधि ऑब्जेक्ट की अपनी कुंजियों की एक सरणी लौटाती है। यह प्रोटोटाइप की समस्याओं से छुटकारा दिलाती है और सरणी के सभी तरीकों तक पहुँच प्रदान करती है।

\n\n

const keys = Object.keys(user);\nconsole.log(keys); // ['name', 'age', 'city', 'isAdmin']\n\nkeys.forEach(key => {\n  console.log(key + ': ' + user[key]);\n});

\n\n

लाभ:

केवल अपने गुणों (गैर-विरासत) के साथ काम करता है
एक सरणी लौटाता है — forEach, map, filter का उपयोग किया जा सकता है
पढ़ने योग्य और अनुमानित कोड

\n\n

जब मुझे केवल कुंजियों की सूची प्राप्त करनी हो और उनके साथ काम करना हो, तो यह मेरा पसंदीदा तरीका है।

\n\n

3. Object.values() — जब केवल मानों की आवश्यकता हो

\n\n

कभी-कभी हमें केवल गुणों के मानों में रुचि होती है, कुंजियों में नहीं। उदाहरण के लिए, डेटा को जोड़ने या प्रदर्शित करने के लिए।

\n\n

const values = Object.values(user);\nconsole.log(values); // ['अन्ना', 28, 'मॉस्को', false]\n\nvalues.forEach(value => {\n  console.log(value);\n});

\n\n

यह विधि ES2017 में आई और डेटा संग्रह के साथ काम करने के लिए उपयुक्त है, जहाँ कुंजियाँ मायने नहीं रखतीं।

\n\n

4. Object.entries() — विधियों में राजा

\n\n

Object.entries() सरणियों की एक सरणी लौटाता है, जहाँ प्रत्येक नेस्टेड सरणी एक [कुंजी, मान] जोड़ी है। यह जावास्क्रिप्ट में ऑब्जेक्ट को पुनरावृत्त करने के लिए एक सार्वभौमिक उपकरण है।

\n\n

const entries = Object.entries(user);\nconsole.log(entries);\n// [\n//   ['name', 'अन्ना'],\n//   ['age', 28],\n//   ['city', 'मॉस्को'],\n//   ['isAdmin', false]\n// ]\n\nentries.forEach(([key, value]) => {\n  console.log(`${key}: ${value}`);\n});

\n\n

forEach के पैरामीटर में डिस्ट्रक्चरिंग पर ध्यान दें: ([key, value])। यह कोड को साफ और संक्षिप्त बनाता है।

\n\n

कब उपयोग करें: