Computer >> कंप्यूटर >  >> प्रोग्रामिंग >> Javascript

जावास्क्रिप्ट क्लास:एक गाइड

जावास्क्रिप्ट प्रोटोटाइप पर आधारित है। हर बार जब आप किसी वस्तु की घोषणा करते हैं, तो एक प्रोटोटाइप संपत्ति बनाई जाती है जो उस वस्तु से जुड़े गुणों और विधियों का विस्तार करती है।

पिछले कुछ वर्षों में, कई जावास्क्रिप्ट डेवलपर्स ने अपने कोड में ऑब्जेक्ट-ओरिएंटेड डिज़ाइन को शामिल करने के तरीके खोजे हैं। इसने जावास्क्रिप्ट में एक नए प्रकार की वस्तु को जन्म दिया है जिसे एक वर्ग कहा जाता है, जो एक प्रोटोटाइप का विस्तार करता है।

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

JavaScript क्लास क्या है?

क्लास किसी ऑब्जेक्ट के लिए टेम्प्लेट घोषित करने का एक तरीका है।

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

एक वर्ग का एक उदाहरण होगा Book . इस वर्ग में इस बात का खाका होगा कि किताबों में कौन सी जानकारी संग्रहीत की जा सकती है और उस डेटा को कैसे बदला जा सकता है। एक वस्तु ए स्ट्रीटकार नेम्ड डिज़ायर हो सकती है, जो एक व्यक्तिगत पुस्तक है।

जावास्क्रिप्ट में, कक्षाएं वे हैं जिन्हें हम वाक्यात्मक चीनी कहते हैं। वर्ग वाक्य रचना में मधुरता है, लेकिन वे जरूरी नहीं कि किसी नई कार्यक्षमता में शामिल हों।

कक्षाएं आमतौर पर आधुनिक जावास्क्रिप्ट ढांचे जैसे रिएक्ट और नेक्स्ट.जेएस में उपयोग की जाती हैं।

81% प्रतिभागियों ने कहा कि बूटकैंप में भाग लेने के बाद उन्हें अपनी तकनीकी नौकरी की संभावनाओं के बारे में अधिक आत्मविश्वास महसूस हुआ। आज ही एक बूटकैंप से मिलान करें।

बूटकैंप शुरू करने से लेकर अपनी पहली नौकरी खोजने तक, औसत बूटकैंप ग्रेड ने करियर संक्रमण में छह महीने से भी कम समय बिताया।

कक्षा बनाम कार्य

यदि आपको इस लेख की एक बात याद है, तो इसे रहने दें:कक्षाएं केवल सामान्य कार्य हैं।

एक वर्ग और एक फ़ंक्शन अभिव्यक्ति के बीच एकमात्र अंतर यह है कि उन्हें कैसे घोषित किया जाता है; फ़ंक्शन function का उपयोग करते हैं कीवर्ड और कक्षाएं class का उपयोग करती हैं खोजशब्द। तकनीकी रूप से, आप क्लास कीवर्ड का उपयोग किए बिना भी क्लास घोषित कर सकते हैं।

हम बता सकते हैं कि वे दो फ़ंक्शन बनाकर और उनके प्रोटोटाइप को प्रिंट करके समान हैं:

const PlayerFunction =function() {}const PlayerClass =class {}console.log(Object.getPrototypeOf(PlayerFunction));console.log(Object.getPrototypeOf(PlayerClass));

हमारी कक्षा अभिव्यक्ति और कार्य रिटर्न:

समारोह ()

समारोह ()

हमारे फंक्शन और क्लास दोनों एक ही प्रोटोटाइप-आधारित आर्किटेक्चर का उपयोग करते हैं।

कक्षा कैसे परिभाषित करें

आप एक वर्ग को कैसे परिभाषित करते हैं? यह एक अच्छा सवाल है।

आप class . का उपयोग करके एक वर्ग को परिभाषित कर सकते हैं खोजशब्द। एक बार जब आप एक वर्ग को परिभाषित कर लेते हैं, तो आप इसे कुछ डिफ़ॉल्ट मानों के साथ आरंभ करने के लिए कंस्ट्रक्टर () फ़ंक्शन का उपयोग कर सकते हैं।

एक जावास्क्रिप्ट कंसोल खोलें और इस कोड में पेस्ट करें:

 क्लास बुक {कंस्ट्रक्टर (शीर्षक, लेखक) { यह शीर्षक =शीर्षक; यह लेखक =लेखक; }} 

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

var Streetcar =new Book ("ए स्ट्रीटकार नेम्ड डिज़ायर", "टेनेसी विलियम्स");

हम अपनी कक्षा से मूल्यों को पुनः प्राप्त कर सकते हैं जैसे हम किसी वस्तु से करेंगे:

console.log(streetcar.title);

हमारा कोड रिटर्न:ए स्ट्रीटकार नेम्ड डिज़ायर।

कक्षा पद्धति को कैसे परिभाषित करें

प्रोटोटाइप पर कक्षाओं का उपयोग करने के लाभों में से एक यह है कि आप कक्षा के अंदर एक विधि घोषित कर सकते हैं। इसका मतलब है कि आपको prototype . का उपयोग करने की आवश्यकता नहीं है मौजूदा फ़ंक्शन में एक नई विधि जोड़ने के लिए सिंटैक्स।

इस उदाहरण पर विचार करें:

क्लास बुक { कंस्ट्रक्टर (शीर्षक, लेखक) { यह शीर्षक =शीर्षक; यह लेखक =लेखक; } getDetails() { console.log(`${this.title} ${this.author}.` द्वारा लिखित एक किताब है); }} 

हमने getDetails() . नामक एक विधि घोषित की है जो हमारी कक्षा के अंदर मौजूद है। यह अच्छा है क्योंकि यह हमारे सभी कोड को एक साथ समूहीकृत रखता है। आइए हमारे getDetails() . को कॉल करें समारोह:

var Streetcar =new Book("A Streetcar Named Desire", "Tennessee Williams");streetcar.getDetails();

हमारा कोड लौटाता है:

ए स्ट्रीटकार नेम्ड डिज़ायर टेनेसी विलियम्स द्वारा लिखित एक पुस्तक है।

इनहेरिटिंग क्लासेस

किसी भी वस्तु-उन्मुख संरचना की तरह, कक्षाएं अन्य वर्गों से गुण प्राप्त कर सकती हैं।

वंशानुक्रम एक ऐसी प्रक्रिया को संदर्भित करता है जहां एक बाल वर्ग माता-पिता वर्ग से विधियों और डेटा तक पहुंच सकता है। किसी वर्ग को इनहेरिट करने के लिए, आप extends . का उपयोग कर सकते हैं खोजशब्द। एक जावास्क्रिप्ट फ़ाइल बनाएँ या अपना जावास्क्रिप्ट कंसोल खोलें और इस कोड में पेस्ट करें:

क्लास फिक्शन बुक का विस्तार करता है {कंस्ट्रक्टर (शीर्षक, लेखक, फिक्शन) {सुपर (शीर्षक, लेखक); यह.कथा =सच; }} 

हमने फिक्शन नामक एक वर्ग बनाया है जो बुक क्लास का उपयोग करता है जिसे हमने पहले ब्लूप्रिंट के रूप में घोषित किया था। हमारे कोड में, हमने super() . का उपयोग किया है मूल वर्ग से मान शीर्षक और लेखक को इनहेरिट करने के लिए कीवर्ड, जो कि बुक है। फिर, हमने एक नई विशेषता परिभाषित की है, fiction , जिसका मान डिफ़ॉल्ट रूप से सत्य पर सेट है।

आइए हमारे नए फिक्शन वर्ग का एक ऑब्जेक्ट बनाएं:

var gatsby =new Fiction("The Great Gatsby", "F. Scott Fitzgerald");console.log(gatsby.fiction);

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

गेटर्स एंड सेटर्स

कक्षाओं के साथ काम करते समय, आपको गेट्टर और सेटर फ़ंक्शन का उपयोग करना चाहिए।

गेट्टर फ़ंक्शन आपको एक वर्ग से विधियों को पुनः प्राप्त करने की अनुमति देता है। सेटर फ़ंक्शन आपको किसी वर्ग में किसी विशेष आइटम के मान को बदलने की अनुमति देता है। इन कार्यों को get . का उपयोग करके दर्शाया जाता है और set कीवर्ड, क्रमशः।

निम्नलिखित कोड पर विचार करें:

क्लास बुक { कंस्ट्रक्टर (शीर्षक, लेखक) { यह शीर्षक =शीर्षक; यह लेखक =लेखक; } लेखक प्राप्त करें () { इसे वापस करें। लेखक; } लेखक (लेखक) सेट करें { यह लेखक =लेखक; }} 

इस उदाहरण में, हमने author . नामक दो विधियों की घोषणा की है . इन विधियों में से एक हमें author . के मान को पुनः प्राप्त करने की अनुमति देता है; यह हमारा get है तरीका। दूसरी विधि हमें author . के मान को बदलने की अनुमति देती है .

हम निम्नलिखित कोड का उपयोग करके इसे क्रिया में देख सकते हैं:

var Streetcar =new Book("A Streetcar Named Desire", "");streetcar.author ="Tennessee Williams";console.log(streetcar.author);

हमारा कोड रिटर्न:टेनेसी विलियम्स।

हमने streetcar . नामक ऑब्जेक्ट को इनिशियलाइज़ किया है और इसे शीर्षक दिया A Streetcar Named Desire . फिर हम author . का मान सेट करते हैं करने के लिए Tennessee Williams सेटर का उपयोग करके जिसे हमने अपने कोड में परिभाषित किया है। अंत में, हमने author . का मान प्रिंट कर लिया गेट्टर विधि का उपयोग करके कंसोल पर।

निष्कर्ष

जबकि कक्षाएं जावास्क्रिप्ट में कोई नई कार्यक्षमता नहीं जोड़ती हैं, वे लेखन कार्यों को समझने में आसान बनाती हैं यदि आप ऑब्जेक्ट-ओरिएंटेड प्रोग्रामिंग के अभ्यस्त हैं।

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

अब आप जावास्क्रिप्ट विशेषज्ञ जैसी कक्षाओं का उपयोग शुरू करने के लिए तैयार हैं!


  1. एपेंड चाइल्ड जावास्क्रिप्ट:एक गाइड

    JavaScript appendChild () विधि एक नोड के अंत में एक आइटम जोड़ती है। appendChild () का उपयोग अक्सर आइटम को सूची में जोड़ने के लिए किया जाता है। यदि आप एक नोड में एक से अधिक आइटम जोड़ना चाहते हैं, तो आपको कई एपेंड चाइल्ड () स्टेटमेंट का उपयोग करना चाहिए। JavaScript एपेंड चाइल्ड का उपयोग कैसे करें क

  1. जावास्क्रिप्ट में सुपर कीवर्ड?

    सुपर द सुपर कीवर्ड का उपयोग किसी ऑब्जेक्ट के पैरेंट पर फ़ंक्शन को एक्सेस करने और कॉल करने के लिए किया जाता है। super.prop और सुपर[expr] भाव दोनों वर्गों और वस्तु शाब्दिक में किसी भी विधि परिभाषा में सुपाठ्य हैं। इसका उपयोग विस्तारित . में किया जाता है वर्ग, जो विस्तारित . का उपयोग करता है कीवर्ड।

  1. जावास्क्रिप्ट में क्लास कीवर्ड

    ES6 में शुरू की गई जावास्क्रिप्ट कक्षाएं, जावास्क्रिप्ट प्रोटोटाइप-आधारित वंशानुक्रम पर वाक्यात्मक चीनी हैं। कक्षाएं वास्तव में विशेष कार्य हैं। आप निम्न सिंटैक्स का उपयोग करके क्लास कीवर्ड का उपयोग करके जावास्क्रिप्ट में कक्षाएं परिभाषित कर सकते हैं - class Person {    // Constructor for