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

जावास्क्रिप्ट डेकोरेटर्स क्या हैं?

डेकोरेटर एक विशेष सिंटैक्स है जिसका उपयोग कक्षाओं और उनके सदस्यों को संशोधित करने के लिए किया जाता है। वे ऐसे फ़ंक्शन हैं जिन्हें कक्षाओं, विधियों या गुणों पर लागू किया जा सकता है, जो आपको स्रोत कोड को सीधे संशोधित किए बिना व्यवहार का विस्तार करने में सक्षम बनाता है। वे आपको लॉगिंग, सत्यापन, या अन्य मेटा-स्तरीय चिंताओं जैसे तर्क को स्वच्छ और पुन: प्रयोज्य तरीके से समाहित करने की अनुमति देते हैं।

डेकोरेटर्स का उपयोग क्यों करें?

• पुन: प्रयोज्य तर्क: डेकोरेटर आपको अपने एप्लिकेशन में समान कोड दोहराए बिना सामान्य कार्यक्षमता (जैसे लॉगिंग, सत्यापन, आदि) जोड़ने देते हैं।

• बेहतर पठनीयता: डेकोरेटर के साथ, आप जटिल तर्क को एक साफ, घोषणात्मक वाक्यविन्यास में समाहित कर सकते हैं, जिससे आपका कोड अधिक पठनीय और रखरखाव योग्य हो जाता है।

• चिंताओं का पृथक्करण: आप व्यावसायिक तर्क को कैशिंग, मॉनिटरिंग या प्रदर्शन ट्रैकिंग जैसी मेटा-स्तरीय चिंताओं से अलग रख सकते हैं।

क्या डेकोरेटर्स का उपयोग अब जावास्क्रिप्ट में किया जा सकता है?

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

टाइपस्क्रिप्ट में डेकोरेटर्स को सक्षम करना

{
    "compilerOptions": {
        "experimentalDecorators": true
    }
}

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

बेबेल में डेकोरेटर्स को सक्षम करना

यदि आप बैबेल का उपयोग कर रहे हैं, तो आप @babel/plugin-proposal-decorters प्लगइन का उपयोग करके डेकोरेटर्स को सक्षम कर सकते हैं। इसे स्थापित करने के लिए, इन चरणों का पालन करें:

1.प्लगइन इंस्टॉल करें:

 npm install @babel/plugin-proposal-decorators --save-dev

2.प्लगइन को अपने बैबल कॉन्फ़िगरेशन में जोड़ें:

 {
     "plugins": [
         ["@babel/plugin-proposal-decorators", { "legacy": true }]
     ]
 }

यह कॉन्फ़िगरेशन बैबेल को डेकोरेटर सिंटैक्स को मानक जावास्क्रिप्ट में ट्रांसपाइल करने की अनुमति देगा।

डेकोरेटर्स का उपयोग करने का वास्तविक-विश्व उदाहरण

आइए एक वास्तविक दुनिया का उदाहरण देखें कि कक्षाओं, विधियों और गुणों में सामान्य कार्यक्षमता जोड़ने के लिए डेकोरेटर का उपयोग कैसे किया जा सकता है। हम एक साधारण लॉगिंग डेकोरेटर और एक वैलिडेशन डेकोरेटर के साथ शुरुआत करेंगे।

लॉगिंग डेकोरेटर

function logExecution(target, key, descriptor) {
    const originalMethod = descriptor.value;

    descriptor.value = function (...args) {
        console.log(`Method ${key} invoked with arguments:`, args);
        return originalMethod.apply(this, args);
    };

    return descriptor;
}

class Calculator {
    @logExecution
    add(a, b) {
        return a   b;
    }
}

const calc = new Calculator();
calc.add(5, 7); // Logs: Method add invoked with arguments: [5, 7]

डेकोरेटर्स का उपयोग करने के मुख्य लाभ

• मॉड्यूलराइजेशन: डेकोरेटर आपको अपनी कक्षाओं या विधियों के मुख्य तर्क से लॉगिंग, सत्यापन और प्रदर्शन निगरानी जैसी कार्यक्षमता को अलग करने की अनुमति देते हैं।

• कोड पुन: प्रयोज्य: डेकोरेटर का उपयोग करके, आप कई तरीकों या वर्गों में एक ही तर्क को दोहराने से बचते हैं।

• पठनीयता: डेकोरेटर आपके कोड को अधिक घोषणात्मक बनाते हैं, जिससे अन्य डेवलपर्स एक नज़र में किसी वर्ग या विधि के व्यवहार और उद्देश्य को आसानी से समझ सकते हैं।

जैसे-जैसे डेकोरेटर एक मानक बनने के करीब पहुंचते हैं, वे अपने जावास्क्रिप्ट अनुप्रयोगों को बढ़ाने के इच्छुक डेवलपर्स के लिए एक आवश्यक उपकरण बने रहेंगे।

अपनी परियोजनाओं की संरचना और रखरखाव में सुधार के लिए आज ही डेकोरेटर्स के साथ प्रयोग करना शुरू करें!