जावास्क्रिप्ट में एक ऑब्जेक्ट क्लास है जिसमें ऑब्जेक्ट्स में हेरफेर करने के लिए सभी प्रकार के मेथड्स हैं। इस लेख में, हम Object.assign() मेथड पर एक नज़र डालेंगे और प्रदर्शित करेंगे कि इसका उपयोग कैसे किया जाता है।
थोड़ा बैकग्राउंड
रिमाइंडर के रूप में, ऑब्जेक्ट जावास्क्रिप्ट में डेटा प्रकार है, पायथन में डिक्शनरीज़ के समान, जिसमें हमारे पास की-वैल्यू पेयर्स होते हैं। मान लीजिए हमारे पास एक ऑब्जेक्ट है, चलिए इसे हैरी कहते हैं। इसमें की-वैल्यू पेयर्स हो सकते हैं जो इस तरह दिखते हैं:
let Harry = { firstName: 'Harry', lastName: 'Potter', age: 11, house: 'Gryffindor', pet: { name: 'Hedwig', animal: 'owl' } };
इस स्थिति में बुनियादी नियम यह है कि कोलन के बाईं ओर प्रॉपर्टी नाम कुंजी है, और दाईं ओर की चीजें मान हैं। अधिकांश कुंजियां और मान काफी सीधे हैं - केवल एक जो थोड़ा मुश्किल हो सकता है वह है अंतिम प्रॉपर्टी: pet। Pet इस इंस्टेंस में अभी भी कुंजी है। मान, हालांकि, एक ऑब्जेक्ट है जिसमें दो और की-वैल्यू पेयर्स हैं। इसे हम नेस्टेड ऑब्जेक्ट कहते हैं।
Object.assign(target, …sourceObjs);
Object नामक एक मेथड है जिसे assign() कहा जाता है जिसका उपयोग एक या अधिक स्रोत ऑब्जेक्ट्स को लेकर उन्हें टार्गेट ऑब्जेक्ट में कॉपी करने के लिए किया जा सकता है। आइए सीधे कोड पर जाएं यह देखने के लिए कि यह क्या करता है:
let hpChar = { firstName: 'Harry', lastName: 'Potter', age: 11, house: 'Gryffindor', pet: { name: 'Hedwig', animal: 'owl' } } Object.assign({}, hpChar); console.log(hpChar, '\n'); Object.assign(hpChar, { firstName: 'Hermione', lastName: 'Grainger', pet: { name: 'Crookshanks', animal: 'cat' } } ); console.log(hpChar)
आइए कोड को एक साथ देखें। हम hpChar नामक ऑब्जेक्ट लिटरल से शुरू करते हैं। इस hpChar में firstName, lastName, age, house, और pet प्रॉपर्टी है। वह pet प्रॉपर्टी स्वयं एक ऑब्जेक्ट है और इसकी अपनी कुंजियां और मान हैं।
अगला, हमारे मेथड का पहला इंस्टेंस है जिसके बारे में हम यहां बात करने आए हैं। Object.assign दो या अधिक पैरामीटर्स लेता है। पहला हमेशा टार्गेट ऑब्जेक्ट होता है जिसे आप मान असाइन करना चाहते हैं। इस इंस्टेंस में, यह एक खाली ऑब्जेक्ट है।
दूसरा पैरामीटर हमारा ऊपर परिभाषित ऑब्जेक्ट है। यह स्रोत सामग्री है जिसे हम टार्गेट ऑब्जेक्ट (हमारा पहला पैरामीटर) को असाइन करने के लिए लेने जा रहे हैं।
निम्नलिखित लाइन परिणाम को कंसोल में लॉग करती है:
{ firstName: 'Harry', lastName: 'Potter', age: 11, house: 'Gryffindor', pet: { name: 'Hedwig', animal: 'owl' } }
कुछ खास अलग नहीं, है ना? ऐसा इसलिए है क्योंकि हमने hpChar को खाली ऑब्जेक्ट को असाइन किया - हमने अनिवार्य रूप से ऑब्जेक्ट को क्लोन किया। क्या होगा अगर हम इसे फिर से करें, लेकिन कुछ मान बदलें? इस बार खाली ऑब्जेक्ट के बजाय, आइए इसे hpChar ऑब्जेक्ट से बदलें - यह हमारा टार्गेट होगा। आइए दूसरे पैरामीटर पर कुछ मान बदलें। मान बदलने के लिए स्वतंत्र महसूस करें जब तक आप कुंजियों को समान रखते हैं।
यहां वे मान हैं जिन्हें मैं बदलने जा रहा हूं। यदि टार्गेट ऑब्जेक्ट में मान को बदलने की आवश्यकता नहीं है, तो आपको स्रोत ऑब्जेक्ट में उसका मान स्पष्ट रूप से कॉल करने की आवश्यकता नहीं है।
Object.assign(hpChar, { firstName: 'Hermione', lastName: 'Grainger', pet: { name: 'Crookshanks', animal: 'cat' } } );
दूसरी बार जब हमने परिणाम को कंसोल में लॉग किया, तो इसने टार्गेट ऑब्जेक्ट लौटाया, नए मानों के साथ प्रॉपर्टीज को ओवरराइट करते हुए। अब हमारा कंसोल ऐसा दिखता है:
{ firstName: 'Hermione', lastName: 'Grainger', age: 11, house: 'Gryffindor', pet: { name: 'Crookshanks', animal: 'cat' } }
यही है दो ऑब्जेक्ट्स को समान प्रॉपर्टीज के साथ मर्ज करने का रूप। अब क्या होगा अगर हम अलग-अलग प्रॉपर्टीज वाले तीन ऑब्जेक्ट्स को मर्ज करें? आप क्या होने की उम्मीद करते हैं?
var obj1 = { foo: 1 } var obj2 = { bar: 2 } var obj3 = { baz: 3 } Object.assign(obj1, obj2, obj3) console.log(obj1);
Obj1 हमारा टार्गेट ऑब्जेक्ट है। Obj2 और obj3 हमारे स्रोत ऑब्जेक्ट्स हैं। वे हमारे टार्गेट ऑब्जेक्ट में मर्ज हो जाएंगे। क्योंकि कोई प्रॉपर्टी ओवरलैप नहीं करती, सभी प्रॉपर्टीज अपने संबंधित मानों के साथ obj1 में मर्ज हो जाएंगी।
{ foo: 1, bar: 2, baz: 3 }
वहां आपके पास है! Object.assign() का कार्यान्वयन। एक बार जब आप यहां की अवधारणाओं को समझ लेते हैं, तो आप जावास्क्रिप्ट फ्रेमवर्क सीखने के एक कदम और करीब हैं!
अधिक के लिए तैयार?
अपने अध्ययन को आगे बढ़ाने के लिए इन ट्यूटोरियल्स पर एक नज़र डालें…
जावास्क्रिप्ट Object.keys()
जावास्क्रिप्ट Let के लिए चरण-दर-चरण गाइड
जावास्क्रिप्ट typeof
जावास्क्रिप्ट स्ट्रिंग कंटेन्स: चरण-दर-चरण गाइड
जावास्क्रिप्ट वेरिएबल्स
