ऑब्जेक्ट लिटरल जावास्क्रिप्ट का एक मूलभूत हिस्सा हैं, जो हमें ऑब्जेक्ट को जल्दी से बनाने और आरंभ करने की अनुमति देता है। ES6 और उससे आगे के साथ, जावास्क्रिप्ट ने ऑब्जेक्ट लिटरल में कई संवर्द्धन पेश किए, जिससे वे और भी अधिक शक्तिशाली और संक्षिप्त हो गए। आइए इन सुधारों पर गौर करें और देखें कि वे हमारे कोड को कैसे स्वच्छ और अधिक कुशल बना सकते हैं।

1. आशुलिपि संपत्ति के नाम

ऑब्जेक्ट बनाते समय, यदि प्रॉपर्टी का नाम आपके द्वारा निर्दिष्ट वेरिएबल नाम के समान है, तो आप शॉर्टहैंड सिंटैक्स का उपयोग कर सकते हैं।

const name = 'John';
const age = 30;

// Old way
const person = {
    name: name,
    age: age
};

// New way
const person = { name, age };

console.log(person); // { name: 'John', age: 30 }

यह शॉर्टहैंड सिंटैक्स पुनरावृत्ति को कम करता है और हमारे कोड को अधिक संक्षिप्त बनाता है।
एमडीएन दस्तावेज़ीकरण: ऑब्जेक्ट इनिशियलाइज़र

2. आशुलिपि विधि के नाम

इसी तरह, किसी ऑब्जेक्ट में तरीकों को परिभाषित करते समय, हम फ़ंक्शन कीवर्ड और कोलन को छोड़ सकते हैं।

// Old way
const calculator = {
    add: function(a, b) {
        return a   b;
    }
};

// New way
const calculator = {
    add(a, b) {
        return a   b;
    }
};

console.log(calculator.add(5, 3)); // 8

यह सिंटैक्स साफ-सुथरा और पढ़ने में आसान है, खासकर जब आपके पास किसी ऑब्जेक्ट में कई विधियां हों।
एमडीएन दस्तावेज़ीकरण: विधि परिभाषाएँ

3. गणना की गई संपत्ति के नाम

ES6 हमें संपत्ति के नामों की गणना करने के लिए अभिव्यक्तियों का उपयोग करने की अनुमति देता है। यह विशेष रूप से तब उपयोगी होता है जब आप गतिशील संपत्ति नाम बनाना चाहते हैं।

const prefix = 'user_';
const id = 1234;

const user = {
    [`${prefix}${id}`]: 'John Doe'
};

console.log(user.user_1234); // 'John Doe'

यह सुविधा तब शक्तिशाली होती है जब आपको कुछ तर्क या बाहरी डेटा के आधार पर गतिशील कुंजियों के साथ ऑब्जेक्ट बनाने की आवश्यकता होती है।
एमडीएन दस्तावेज़ीकरण: गणना की गई संपत्ति के नाम

4. विधि गुण

ES6 ने गेट और सेट कीवर्ड का उपयोग करके ऑब्जेक्ट लिटरल में तरीकों को परिभाषित करने का एक नया तरीका पेश किया। यह आपको किसी फ़ंक्शन को स्पष्ट रूप से कॉल किए बिना परिकलित गुण बनाने की अनुमति देता है।

const person = {
    firstName: 'John',
    lastName: 'Doe',
    get fullName() {
        return `${this.firstName} ${this.lastName}`;
    },
    set fullName(name) {
        [this.firstName, this.lastName] = name.split(' ');
    }
};

console.log(person.fullName); // 'John Doe'
person.fullName = 'Jane Smith';
console.log(person.firstName); // 'Jane'
console.log(person.lastName); // 'Smith'

गेटर्स और सेटर्स गणना की गई संपत्तियों को परिभाषित करने का एक साफ तरीका प्रदान करते हैं और मूल्यों को प्राप्त या सेट करते समय सत्यापन या साइड इफेक्ट्स जोड़ने के लिए इसका उपयोग किया जा सकता है।
एमडीएन दस्तावेज़ीकरण: गेट्टर और सेटर

5. ऑब्जेक्ट स्प्रेड ऑपरेटर

हालांकि यह पूरी तरह से ऑब्जेक्ट लिटरल एन्हांसमेंट का हिस्सा नहीं है, स्प्रेड ऑपरेटर (...) एक शक्तिशाली सुविधा है जो ऑब्जेक्ट लिटरल के साथ अच्छी तरह से काम करता है। यह आपको आसानी से ऑब्जेक्ट को क्लोन करने या एकाधिक ऑब्जेक्ट को मर्ज करने की अनुमति देता है।

const defaults = {
    theme: 'light',
    fontSize: 14
};

const userPreferences = {
    fontSize: 16
};

const settings = {
    ...defaults,
    ...userPreferences
};

console.log(settings); // { theme: 'light', fontSize: 16 }

स्प्रेड ऑपरेटर मौजूदा ऑब्जेक्ट के आधार पर नए ऑब्जेक्ट बनाना आसान बनाता है, जो आपके एप्लिकेशन में अपरिवर्तनीयता बनाए रखने के लिए विशेष रूप से उपयोगी है।
एमडीएन दस्तावेज़ीकरण: स्प्रेड सिंटैक्स (...)

निष्कर्ष

जावास्क्रिप्ट में ये ऑब्जेक्ट शाब्दिक संवर्द्धन डेवलपर्स को वस्तुओं के साथ काम करने के लिए अधिक अभिव्यंजक और संक्षिप्त तरीके प्रदान करते हैं। इन सुविधाओं का लाभ उठाकर, आप साफ़, अधिक पठनीय कोड लिख सकते हैं जिसे बनाए रखना आसान है।

याद रखें, हालांकि ये सुविधाएं शक्तिशाली हैं, लेकिन इनका विवेकपूर्ण तरीके से उपयोग करना महत्वपूर्ण है। हमेशा संक्षिप्तता के बजाय कोड की पठनीयता और रख-रखाव को प्राथमिकता दें।

ब्राउज़र संगतता

यहां इन सुविधाओं के लिए ब्राउज़र समर्थन का एक त्वरित अवलोकन दिया गया है:

व्यावहारिक उपयोग के मामले

1. शॉर्टहैंड प्रॉपर्टीज: मौजूदा वेरिएबल्स से ऑब्जेक्ट बनाने के लिए बढ़िया, खासकर रिएक्ट कंपोनेंट प्रॉप्स में।
2. शॉर्टहैंड विधियां: वर्ग-जैसी संरचनाओं में या कई संबंधित कार्यों को परिभाषित करते समय उपयोगी।
3. गणना की गई संपत्ति के नाम: अंतर्राष्ट्रीयकरण (i18n) ऑब्जेक्ट में गतिशील कुंजी बनाने के लिए आदर्श।
4. गेटर/सेटर विधियां: अंतर्निहित सत्यापन या साइड इफेक्ट के साथ "स्मार्ट" गुण बनाने के लिए बिल्कुल सही।
5. ऑब्जेक्ट स्प्रेड: Redux में राज्य प्रबंधन के लिए या थोड़े से संशोधनों के साथ नई ऑब्जेक्ट बनाने के लिए उत्कृष्ट।

प्रदर्शन संबंधी विचार

हालांकि इन संवर्द्धन में आम तौर पर महत्वपूर्ण प्रदर्शन निहितार्थ नहीं होते हैं, ऑब्जेक्ट स्प्रेड ऑपरेटर कई संपत्तियों को मर्ज करने के लिए ऑब्जेक्ट.असाइन() से कम कुशल हो सकता है। अधिकांश उपयोग के मामलों में, पठनीयता लाभ किसी भी मामूली प्रदर्शन अंतर से अधिक है।

संबंधित विशेषताएँ

आधुनिक जावास्क्रिप्ट ऑब्जेक्ट हेरफेर की अपनी समझ को और बढ़ाने के लिए, अन्वेषण पर विचार करें:

• डिस्ट्रक्चरिंग असाइनमेंट
• ऑब्जेक्ट.असाइन() विधि
• ऑब्जेक्ट.एंट्रीज़(), ऑब्जेक्ट.वैल्यूज़(), और ऑब्जेक्ट.कीज़() विधियाँ
• ऑब्जेक्ट अपरिवर्तनीयता के लिए ऑब्जेक्ट.फ़्रीज़() और ऑब्जेक्ट.सील() विधियाँ

इन ऑब्जेक्ट शाब्दिक संवर्द्धन और संबंधित सुविधाओं में महारत हासिल करके, आप अधिक सुरुचिपूर्ण और कुशल जावास्क्रिप्ट कोड लिखने के लिए अच्छी तरह से सुसज्जित होंगे।

यदि आपको यह लेख उपयोगी लगता है, तो JavaScript, Reactjs और Next.js पर अधिक अपडेट और उपयोगी संसाधन प्राप्त करने के लिए फ़ॉलो बटन पर क्लिक करें। उपयोगी संसाधनों और तकनीकी रुझानों को प्राप्त करने के लिए आप मुझे ट्विटर @OgDev-01 पर या OpenSauced पर भी फॉलो कर सकते हैं और देख सकते हैं कि मैं क्या योगदान दे रहा हूं और किसे उजागर करता हूं!