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

ES6 कक्षाएं वस्तुओं की संरचना को समझना आसान बनाती हैं। एक्सटेंड्स का उपयोग करना इनहेरिटेंस को सरल बनाता है लेकिन ES6 से पहले, इसे इनहेरिट करने और लागू करने के लिए प्रोटोटाइप का उपयोग किया जाता था। इस अवधारणा को समझने के लिए यहां ब्लॉग है।

पीएस: जावास्क्रिप्ट में प्रोटोटाइप डिज़ाइन पैटर्न में, कोई अंतर्निहित क्लोन() विधि नहीं है जैसा कि कुछ अन्य भाषाओं (उदाहरण के लिए, जावा) में है। हालाँकि, आप समान कार्यक्षमता प्रदान करने के लिए अपने प्रोटोटाइप या कंस्ट्रक्टर फ़ंक्शन में मैन्युअल रूप से क्लोन() विधि लागू कर सकते हैं।

प्रोटोटाइप पैटर्न के पीछे का विचार यह है:

1. एक ऑब्जेक्ट बनाएं जो प्रोटोटाइप (ब्लूप्रिंट) के रूप में कार्य करता है।
2. नए इंस्टेंस बनाने के लिए उस ऑब्जेक्ट का उपयोग करें, या तो उसे कॉपी करके या नए इंस्टेंस को प्रोटोटाइप से लिंक करके।

प्रोटोटाइप पैटर्न की मुख्य अवधारणाएँ

प्रोटोटाइप: एक टेम्पलेट ऑब्जेक्ट जिससे नई ऑब्जेक्ट बनाई जाती हैं।
क्लोनिंग: प्रोटोटाइप की प्रतिलिपि बनाकर नई वस्तुएं बनाई जाती हैं।
प्रोटोटाइप श्रृंखला: वस्तुएं अपने प्रोटोटाइप को व्यवहार सौंप सकती हैं

भाग 1: आधार आकार वर्ग

class Shape {
  constructor(type = 'Generic Shape', color = 'White') {
    this.type = type;
    this.color = color;
  }

  getDetails() {
    return `Type: ${this.type}, Color: ${this.color}`;
  }

  // Clone method to create a new object with the same prototype
  clone() {
    return Object.create(this);  // Creates a new object that inherits from this prototype
  }
}

स्पष्टीकरण:

उद्देश्य: आकार वर्ग एक आधार वर्ग या "प्रोटोटाइप" के रूप में कार्य करता है जिससे वृत्त या आयत जैसी विशिष्ट आकृतियाँ विरासत में मिल सकती हैं।

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

भाग 2: सर्कल क्लास

class Circle extends Shape {
  constructor(radius = 0, color = 'White') {
    super('Circle', color); // Calls the parent (Shape) constructor
    this.radius = radius;
  }

  getArea() {
    return Math.PI * this.radius * this.radius;
  }
}

स्पष्टीकरण:
उद्देश्य: वृत्त वर्ग आकार वर्ग का विस्तार करता है और एक विशिष्ट प्रकार के आकार का प्रतिनिधित्व करता है।

गुण:

• त्रिज्या: वृत्त की त्रिज्या.
• कंस्ट्रक्टर में, सुपर() फ़ंक्शन कंस्ट्रक्टर को कॉल करता है आकार वर्ग, आकार प्रकार और रंग के रूप में "सर्कल" पास करें।

getArea() विधि: यह सूत्र π * त्रिज्या^2 का उपयोग करके वृत्त के क्षेत्रफल की गणना करता है।

भाग 3: आयत वर्ग

class Rectangle extends Shape {
  constructor(width = 0, height = 0, color = 'White') {
    super('Rectangle', color);  // Calls the parent (Shape) constructor
    this.width = width;
    this.height = height;
  }

  getArea() {
    return this.width * this.height;
  }
}

स्पष्टीकरण:

उद्देश्य: आयत वर्ग आकार वर्ग का विस्तार करता है और एक अन्य विशिष्ट प्रकार के आकार (एक आयत) का प्रतिनिधित्व करता है।

• सर्कल क्लास की तरह, रेक्टेंगल क्लास पैरेंट क्लास शेप कंस्ट्रक्टर को कॉल करने के लिए सुपर() का उपयोग करता है, यह निर्दिष्ट करते हुए कि यह एक "रेक्टेंगल" है।
• getArea() विधि: यह सूत्र चौड़ाई * ऊंचाई
का उपयोग करके आयत के क्षेत्र की गणना करता है

भाग 4: क्लोनिंग और प्रोटोटाइप का उपयोग करना

const circlePrototype = new Circle();  // Create prototype
const myCircle = circlePrototype.clone();  // Clone the prototype
myCircle.radius = 5;
myCircle.color = 'Red';

const rectanglePrototype = new Rectangle();  // Create prototype
const myRectangle = rectanglePrototype.clone();  // Clone the prototype
myRectangle.width = 10;
myRectangle.height = 5;
myRectangle.color = 'Blue';

स्पष्टीकरण:

यहां, नए कीवर्ड का उपयोग करके स्क्रैच से मायसर्कल और मायरेक्टेंगल ऑब्जेक्ट बनाने के बजाय, हम प्रोटोटाइप क्लोन कर रहे हैं।

क्लोनिंग प्रक्रिया:

• सबसे पहले, हम प्रोटोटाइप इंस्टेंसेस (सर्कलप्रोटोटाइप और रेक्टेंगलप्रोटोटाइप) बनाते हैं।
• फिर, हम क्लोन() विधि का उपयोग करके इन प्रोटोटाइप को क्लोन करते हैं, जो प्रोटोटाइप ऑब्जेक्ट से प्राप्त नई ऑब्जेक्ट बनाता है।

क्लोन किए गए उदाहरणों को संशोधित करना:

• क्लोनिंग के बाद, हम अपनी आवश्यकताओं से मेल खाने के लिए क्लोन किए गए ऑब्जेक्ट (जैसे, त्रिज्या, चौड़ाई, ऊंचाई, रंग) के गुणों (जैसे, त्रिज्या, चौड़ाई, ऊंचाई, रंग) को संशोधित करते हैं।
• यह हमें केवल आवश्यक गुणों को संशोधित करते हुए, बेस प्रोटोटाइप से आसानी से कई ऑब्जेक्ट बनाने की अनुमति देता है।

भाग 5: आउटपुट

console.log(myCircle.getDetails()); // Output: Type: Circle, Color: Red
console.log(`Circle Area: ${myCircle.getArea()}`);  // Output: Circle Area: 78.54

console.log(myRectangle.getDetails()); // Output: Type: Rectangle, Color: Blue
console.log(`Rectangle Area: ${myRectangle.getArea()}`);  // Output: Rectangle Area: 50

स्पष्टीकरण:

• हम myCircle और myRectangel के विवरण (प्रकार और रंग) को प्रिंट करने के लिए शेप क्लास से विरासत में मिली getDetails() विधि का उपयोग करते हैं।
• हम प्रत्येक आकृति के क्षेत्र की गणना और प्रदर्शित करने के लिए getArea() विधियों (वृत्त और आयत वर्गों के लिए विशिष्ट) का भी उपयोग करते हैं।

प्रोटोटाइप डिज़ाइन पैटर्न परिप्रेक्ष्य:

• प्रोटोटाइप निर्माण: स्क्रैच से सर्कल और रेक्टेंगल की नई ऑब्जेक्ट बनाने के बजाय, हम पहले एक प्रोटोटाइप इंस्टेंस (सर्कलप्रोटोटाइप और रेक्टेंगलप्रोटोटाइप) बनाते हैं।
• क्लोनिंग: एक बार प्रोटोटाइप मौजूद हो जाने पर, प्रोटोटाइप के आधार पर नई ऑब्जेक्ट बनाने के लिए क्लोन() विधि का उपयोग किया जाता है। यह प्रोटोटाइप पैटर्न का सार है: किसी मौजूदा ऑब्जेक्ट (प्रोटोटाइप) की प्रतिलिपि बनाकर ऑब्जेक्ट बनाना।

उदाहरण:

प्रोटोटाइप पैटर्न तब उपयोगी होता है जब:

• आपको मौजूदा वस्तुओं की क्लोनिंग करके नई वस्तुएं बनाने की आवश्यकता है।
• आप उपवर्गीकरण से बचना चाहते हैं और मौजूदा वस्तुओं को ब्लूप्रिंट के रूप में सीधे पुन: उपयोग करना चाहते हैं।
• निर्माण महंगा या जटिल है और जब कई समान वस्तुओं को बनाने की आवश्यकता होती है। प्रोटोटाइप का उपयोग करके, आप प्रक्रिया को सुव्यवस्थित कर सकते हैं और दक्षता में सुधार कर सकते हैं।

यदि आप यहां तक ​​पहुंच गए हैं?✨, किसी भी प्रश्न या विचार के साथ नीचे टिप्पणी करें। मुझे आपकी बातें सुनना और कुछ बेहतरीन चर्चाओं में शामिल होना अच्छा लगेगा!✨