परिचय: सामान्य कॉपी क्यों काम नहीं करती?
\n\nकल्पना करें: आप एक ऐप बना रहे हैं जो यूज़र के जटिल कॉन्फ़िगरेशन को प्रोसेस करता है। आप const newConfig = oldConfig करते हैं, कुछ फ़ील्ड बदलते हैं — और अचानक असली ऑब्जेक्ट भी बदल जाता है। यह दर्द जाना-पहचाना है? 👋
JavaScript में ऑब्जेक्ट रेफरेंस से पास होते हैं। इसका मतलब है कि साधारण असाइनमेंट नया ऑब्जेक्ट नहीं बनाता, बल्कि पुराने का पॉइंटर कॉपी करता है। यही वजह है कि Stack Overflow पर हज़ारों डेवलपर्स पूछते हैं: "JavaScript में ऑब्जेक्ट को डीप क्लोन करने का सबसे कारगर तरीका क्या है?"।
\n\nइस आर्टिकल में हम डीप कॉपी के सभी लोकप्रिय तरीकों, उनके फ़ायदे, नुकसान और परफॉरमेंस पर चर्चा करेंगे। आप जानेंगे कि 2024 के लिए कौन सा तरीका सबसे बेहतर है, और अपना खुद का भरोसेमंद deep clone कैसे लिखें।
\n\nडीप कॉपी की ज़रूरत क्यों है?
\n\nडीप कॉपी (deep clone) ऑब्जेक्ट की पूरी तरह से स्वतंत्र प्रतिलिपि बनाता है, जिसमें सभी नेस्टेड स्ट्रक्चर शामिल होते हैं। शैलो कॉपी (shallow copy) के विपरीत, जहाँ नेस्टेड ऑब्जेक्ट साझा रहते हैं।
\n\nयहाँ कुछ सामान्य परिदृश्य हैं जहाँ इसकी ज़रूरत होती है:
\n- \n
- Redux / Zustand के साथ काम: स्टेट को म्यूटेट नहीं कर सकते, कॉपी बनानी होती है। \n
- डेटा सीरियलाइज़ेशन सर्वर पर भेजने के लिए। \n
- कैश या कॉन्फ़िगरेशन जिन्हें बदला नहीं जा सकता। \n
- यूनिट टेस्ट: ताकि मूल डेटा प्रभावित न हो। \n
लेकिन यह इतना आसान नहीं है। अगर आप फंक्शन, undefined, Symbol या साइक्लिक रेफरेंस वाले ऑब्जेक्ट को कॉपी करने की कोशिश करते हैं — तो कई तरीके फेल हो जाते हैं या डेटा खो देते हैं। आइए हर तरीके को विस्तार से समझते हैं।
तरीका 1: JSON.parse(JSON.stringify(obj)) — पुराना लेकिन काम का
\n\nशुरुआती डेवलपर्स के बीच यह सबसे लोकप्रिय तरीका है। यह सरल और लिखने में तेज़ है:
\n\nconst original = {\n name: "अन्ना",\n age: 25,\n address: { city: "मॉस्को", zip: 101000 },\n hobbies: ["पढ़ना", "दौड़ना"]\n};\n\nconst clone = JSON.parse(JSON.stringify(original));\n\nclone.address.city = "सेंट पीटर्सबर्ग";\nconsole.log(original.address.city); // "मॉस्को" — ✅ कॉपी स्वतंत्र है!\n\n\nफ़ायदे:
\n- \n
- 🔥 बहुत सरल सिंटैक्स। \n
- 🔥 ज़्यादातर सामान्य मामलों में काम करता है। \n
नुकसान (गंभीर!):
\n- \n
- ❌ फंक्शन खो देता है — वे
undefinedमें बदल जाते हैं। \n - ❌ undefined खो देता है —
undefinedवैल्यू वाले फ़ील्ड गायब हो जाते हैं। \n - ❌ Symbol खो देता है — सिंबल कीज़ गायब हो जाती हैं। \n
- ❌ साइक्लिक रेफरेंस पर काम नहीं करता —
TypeErrorएरर देता है। \n - ❌ डेट्स के साथ समस्या —
Dateस्ट्रिंग में बदल जाता है। \n - ❌ Map, Set, RegExp के साथ समस्या — ये खाली ऑब्जेक्ट बन जाते हैं। \n
निष्कर्ष: केवल उन डेटा के लिए उपयुक्त है जो JSON में सीरियलाइज़ हो सकते हैं (स्ट्रिंग, नंबर, ऐरे, सरल ऑब्जेक्ट)।
\n\nतरीका 2: Structured Clone API — आधुनिक मानक (2024)
\n\n2022 से JavaScript में नेटिव डीप कॉपी का तरीका आया — structuredClone। यह सभी आधुनिक ब्राउज़रों और Node.js 17+ में उपलब्ध है।
const clone = structuredClone(original);\n\nclone.address.city = "कज़ान";\nconsole.log(original.address.city); // "मॉस्को" — ✅\n\n\nstructuredClone क्या कर सकता है:
\n- \n
- ✅ साइक्लिक रेफरेंस — काम करता है! \n
- ✅ डेट्स —
Dateटाइप बरकरार रखता है। \n - ✅ Map और Set — सही ढंग से कॉपी करता है। \n
- ✅ RegExp — यह भी काम करता है। \n
- ✅ ArrayBuffer और Ty