जावास्क्रिप्ट ऑब्जेक्टमध्ये गुणधर्म जोडणे. JavaScript मध्ये ऑब्जेक्ट्ससह कार्य करणे: सिद्धांत आणि सराव. DOM: लोड करणे, अपडेट करणे आणि बदलणे

ऑब्जेक्ट प्रकारासाठी गुणधर्म परिभाषित करणे

प्रोटोटाइप स्पेशल प्रॉपर्टी वापरून तुम्ही पूर्वी परिभाषित केलेल्या ऑब्जेक्ट प्रकारात प्रॉपर्टी जोडू शकता. प्रोटोटाइप वापरून, सर्व वस्तूंसाठी समान गुणधर्म तयार केला जातो या प्रकारच्या, त्या ऑब्जेक्ट प्रकाराच्या एकल उदाहरणाऐवजी. खालील कोड कार प्रकारातील सर्व ऑब्जेक्ट्समध्ये रंग गुणधर्म जोडून आणि नंतर car1 ऑब्जेक्टच्या रंग गुणधर्मासाठी मूल्य नियुक्त करून हे दर्शवितो.

Car.prototype.color = शून्य; car1.color = "काळा";

खालील कोड दाखवतो की तुम्ही डेट ऑब्जेक्टचा प्रोटोटाइप वाढवण्यासाठी गेटर आणि सेटर कसे वापरू शकता आणि त्यात एक वर्षाची प्रॉपर्टी कशी जोडू शकता, जी डेट क्लासच्या सर्व उदाहरणांसाठी काम करेल. हा कोड वापरतो विद्यमान पद्धतीतारीख वर्ग - गेटर आणि सेटर ऑपरेशनसाठी getFullYear आणि setFullYear.

वर्षाच्या मालमत्तेसाठी गेटर आणि सेटर परिभाषित करणे:

Var d = Date.prototype; Object.defineProperty(d, "year", ( get: function() ( return this.getFullYear(); ), set: function(y) ( this.setFullYear(y); ));

गेटर आणि सेटरद्वारे निर्दिष्ट केलेल्या वर्षाची मालमत्ता वापरणे:

वर आता = नवीन तारीख(); console.log(now.year); // 2000 now.year = 2001; // 987617605170 console.log(आता); // बुध एप्रिल 18 11:13:25 GMT-0700 (पॅसिफिक डेलाइट टाइम) 2001

मूलभूतपणे, गेटर्स आणि सेटर एकतर असू शकतात:

गेटर आणि सेटर वापरून परिभाषित करताना, तुम्हाला फक्त गेटसह गेटर आणि सेटसह सेटरचा उपसर्ग करणे आवश्यक आहे. या प्रकरणात, गेटर पद्धतीने कोणत्याही पॅरामीटर्सची अपेक्षा करू नये, तर सेटर पद्धतीमध्ये एकच पॅरामीटर (मालमत्तेला नियुक्त करण्यासाठी नवीन मूल्य) लागते. उदाहरणार्थ:

Var o = ( a: 7, b() मिळवा ( this.a + 1; परत करा), c(x) सेट करा ( this.a = x / 2; ));

Object.defineProperties पद्धत वापरून गेटर्स आणि सेटर कोणत्याही वेळी विद्यमान ऑब्जेक्टमध्ये जोडले जाऊ शकतात. या पद्धतीचा पहिला पॅरामीटर हा ऑब्जेक्ट आहे ज्याला तुम्ही गेटर आणि सेटर नियुक्त करू इच्छिता. दुसरा पॅरामीटर एक ऑब्जेक्ट आहे ज्याची मालमत्ता नावे नावांशी संबंधित असतील गुणधर्म निर्माण केले, आणि मूल्ये ही वस्तू आहेत जी तयार केलेल्या गुणधर्मांचे गेटर आणि सेटर परिभाषित करतात. खालील उदाहरण वरील उदाहरणाप्रमाणेच गेटर आणि सेटर तयार करते:

Var o = ( a: 0); Object.defineProperties(o, ( "b": ( get: function() ( return this.a + 1; ) ), "c": ( set: function(x) ( this.a = x / 2; ) ) )); o.c = 10; // "a" console.log(o.b) मालमत्तेला 10 / 2 (5) नियुक्त करणारे सेटर चालवते; // + 1 (म्हणजे 6) मिळवून देणारा गेटर फायर करतो

गुणधर्म परिभाषित करण्यासाठी तुम्ही दोनपैकी कोणते फॉर्म वापरता ते तुमच्या प्रोग्रामिंग शैलीवर आणि हातातील कार्यावर अवलंबून असते. प्रोटोटाइप परिभाषित करण्यासाठी तुम्ही आधीपासून एखादे ऑब्जेक्ट इनिशिएलायझर वापरत असल्यास, बहुतेक प्रकरणांमध्ये तुम्ही पहिला फॉर्म वापराल. हे अधिक कॉम्पॅक्ट आणि नैसर्गिक आहे. तथापि, हे असामान्य नाही की दुसरा फॉर्म केवळ अशा प्रकरणांमध्ये शक्य आहे जेथे आपण विद्यमान ऑब्जेक्टसह त्याच्या परिभाषामध्ये प्रवेश न करता कार्य करत आहात. दुसरा फॉर्म JavaScript चे डायनॅमिक स्वरूप उत्तम प्रकारे प्रतिबिंबित करतो - परंतु कोड वाचणे आणि समजणे कठीण होऊ शकते.

गुणधर्म काढून टाकत आहे

डिलीट ऑपरेटर वापरून तुम्ही प्रॉपर्टी हटवू शकता. खालील कोड प्रॉपर्टी कशी काढायची ते दाखवते.

// एक नवीन ऑब्जेक्ट तयार करते, myobj, दोन गुणधर्मांसह, a आणि b. var myobj = नवीन ऑब्जेक्ट; myobj.a = 5; myobj.b = 12; // प्रॉपर्टी काढून टाकते, फक्त b प्रॉपर्टीसह myobj सोडून. myobj.a हटवा;

जर तुम्ही ग्लोबल व्हेरिएबल काढून टाकण्यासाठी डिलीट देखील वापरू शकता कीवर्ड var हे घोषित करताना वापरले गेले नाही:

जी = 17; g हटवा;

• तपशीलवार अभ्यासासाठी, वाचा.
• ECMAScript 2015 वर्गांबद्दल जाणून घेण्यासाठी (ऑब्जेक्ट परिभाषित करण्याचा नवीन मार्ग), धडा वाचा.

ऑब्जेक्ट्स हे JavaScript चा आधारशिला आहेत. अनेक अंगभूत डेटा प्रकार ऑब्जेक्ट्स म्हणून प्रस्तुत केले जातात. यशस्वी JavaScript डेव्हलपर होण्यासाठी, ते कसे कार्य करतात याची तुम्हाला स्पष्ट माहिती असणे आवश्यक आहे. ऑब्जेक्टच्या बिल्डिंग ब्लॉक्सना त्याचे फील्ड किंवा JavaScript ऑब्जेक्ट गुणधर्म म्हणतात. ते ऑब्जेक्टच्या कोणत्याही पैलूचे वर्णन करण्यासाठी वापरले जातात. मालमत्तेमध्ये सूचीची लांबी, आकाशाचा रंग किंवा एखाद्या व्यक्तीच्या जन्मतारीखचे वर्णन केले जाऊ शकते. वस्तू तयार करणे सोपी प्रक्रिया. भाषा ऑब्जेक्ट लिटरल म्हणून ओळखले जाणारे वाक्यरचना प्रदान करते, जे कुरळे ब्रेसेसद्वारे दर्शविले जाते.

गुणधर्मांमध्ये प्रवेश करणे

भाषा गुणधर्मांमध्ये प्रवेश करण्यासाठी दोन प्रविष्ट्या प्रदान करते. प्रथम आणि सर्वात सामान्य डॉट नोटेशन म्हणून ओळखले जाते. डॉट नोटेशनमध्ये, होस्ट ऑब्जेक्टचे नाव, त्यानंतर कालावधी आणि मालमत्तेचे नाव निर्दिष्ट करून संसाधनात प्रवेश केला जाऊ शकतो. उदाहरणार्थ, जेव्हा object.foo ला सुरुवातीला एक मूल्य नियुक्त केले होते, तेव्हा त्याचे मूल्य 2 होईल. JavaScript ऑपरेटरवस्तू

पर्यायी प्रवेश वाक्यरचना ब्रॅकेट नोटेशन म्हणून ओळखली जाते. नोटेशनमध्ये, ऑब्जेक्टचे नाव चौकोनी कंसाच्या संचाने पाठवले जाते. त्यांच्यामध्ये, मालमत्तेचे नाव स्ट्रिंग म्हणून निर्दिष्ट केले आहे:

ऑब्जेक्ट["foo"] = ऑब्जेक्ट["foo"] + 1.

हे डॉट नोटेशनपेक्षा अधिक अर्थपूर्ण आहे कारण ते व्हेरिएबलला प्रॉपर्टीच्या नावाचे सर्व किंवा काही भाग निर्दिष्ट करण्यास अनुमती देते. हे शक्य आहे कारण JavaScript ऑब्जेक्ट इंटरप्रिटर आपोआप या अभिव्यक्तीला स्ट्रिंगमध्ये रूपांतरित करतो आणि नंतर संबंधित गुणधर्म प्राप्त करतो. "oo" या स्ट्रिंगसह f व्हेरिएबलची सामग्री एकत्रित करून मालमत्तेची नावे तयार केली जातात:

ऑब्जेक्ट = "बार".

ब्रॅकेट नोटेशन प्रॉपर्टीच्या नावांमध्ये डॉट नोटेशनमध्ये प्रतिबंधित असलेले वर्ण समाविष्ट करण्यास अनुमती देते. उदाहरणार्थ, खालील विधान कंसात पूर्णपणे कायदेशीर आहे. तथापि, वापरकर्त्याने समान गुणधर्माचे नाव डॉट नोटेशनमध्ये तयार करण्याचा प्रयत्न केल्यास, त्यांना वाक्यरचना त्रुटी आढळेल:

ऑब्जेक्ट["!@#$% &*()."] = खरे.

नेस्टेड JavaScript ऑब्जेक्ट्सचे गुणधर्म चेनिंग डॉट्स आणि/किंवा कंस द्वारे ऍक्सेस केले जाऊ शकतात. उदाहरणार्थ, खालील ऑब्जेक्टमध्ये baz नावाचा एक नेस्टेड ऑब्जेक्ट आहे ज्यामध्ये foo नावाचा दुसरा ऑब्जेक्ट आहे ज्यामध्ये बार नावाची प्रॉपर्टी आहे ज्यामध्ये पाच मूल्य आहे:

var ऑब्जेक्ट = ( baz: ( foo: ( bar: 5 ) ) ).

खालील अभिव्यक्ती बार संलग्न मालमत्तेमध्ये प्रवेश करतात. पहिली अभिव्यक्ती डॉट नोटेशन वापरते, तर दुसरी एक्स्प्रेशन स्क्वेअर नोटेशन वापरते. तिसरा अभिव्यक्ती समान परिणाम प्राप्त करण्यासाठी दोन्ही नोंदी एकत्र करते:

• object.baz.foo.bar;
• ऑब्जेक्ट["baz"]["foo"]["bar"];
• ऑब्जेक्ट["baz"].foo["bar"].

मागील उदाहरणात दर्शविलेल्या अभिव्यक्तीमुळे कार्यक्षमतेत घट होऊ शकते गैरवापरआणि JavaScript ऑब्जेक्ट निरुपयोगी रेंडर करा. प्रत्येक बिंदू किंवा कंस अभिव्यक्तीचे मूल्यांकन करण्यासाठी वेळ लागतो. जर एकच गुणधर्म अनेक वेळा वापरला गेला असेल, तर मालमत्तेमध्ये एकदा प्रवेश करणे आणि नंतर भविष्यातील सर्व वापरांसाठी स्थानिक व्हेरिएबलमध्ये मूल्य संचयित करणे अर्थपूर्ण आहे.

पद्धत म्हणून कार्य

जेव्हा फंक्शनचा वापर ऑब्जेक्टचा गुणधर्म म्हणून केला जातो तेव्हा त्याला पद्धत म्हणतात. गुणधर्मांप्रमाणे, ते ऑब्जेक्ट शाब्दिक नोटेशनमध्ये निर्दिष्ट केले आहेत. उदाहरणार्थ:

var ऑब्जेक्ट = ( बेरीज: फंक्शन(फू, बार) ( रिटर्न foo + बार; ) ).

मार्क्स आणि कंस वापरून JavaScript ऑब्जेक्ट पद्धती कॉल केल्या जाऊ शकतात. खालील उदाहरण दोन्ही नोंदी वापरून मागील उदाहरणातील sum() पद्धतीला कॉल करते:

• object.sum(1, 2);
• ऑब्जेक्ट["sum"](1, 2).

ऑब्जेक्ट शाब्दिक नोटेशन नवीन ऑब्जेक्ट्स तयार करण्यासाठी उपयुक्त आहे, परंतु ते विद्यमान वस्तूंमध्ये गुणधर्म किंवा पद्धती जोडू शकत नाही. सुदैवाने, नवीन डेटा जोडणे एखादे असाइनमेंट स्टेटमेंट तयार करण्याइतके सोपे आहे. तयार केले रिक्त वस्तू. त्यानंतर, असाइनमेंट ऑपरेटर वापरून, आम्ही दोन गुणधर्म, foo, आणि bar आणि baz पद्धत जोडतो:

• var ऑब्जेक्ट = ();
• object.foo = 1;
• ऑब्जेक्ट.बार = शून्य;
• object.baz = function() ( परत "baz()" कडून नमस्कार करा; ).

कार्यक्रम Encapsulation

ऑब्जेक्ट-ओरिएंटेड प्रोग्रामिंगची मूळ कल्पना म्हणजे प्रोग्रामचे लहान भागांमध्ये विभाजन करणे आणि प्रत्येक भागाला स्वतःचे राज्य व्यवस्थापित करण्यासाठी जबाबदार बनवणे. अशा प्रकारे, प्रोग्रामचा एक भाग कसा कार्य करतो याबद्दल काही ज्ञान त्या भागासाठी स्थानिक असू शकते. उर्वरित प्रोग्रामवर काम करणाऱ्या एखाद्याला त्याबद्दल आठवत नाही किंवा माहित नसावे. जेव्हा जेव्हा हा स्थानिक डेटा बदलतो तेव्हा फक्त त्याच्या आसपासचा कोड अपडेट करणे आवश्यक असते.

अशा प्रोग्रामचे विविध भाग इंटरफेसद्वारे एकमेकांशी संवाद साधतात, फंक्शन्सचे मर्यादित संच किंवा त्यांची अचूक अंमलबजावणी लपवताना अधिक अमूर्त स्तरावर उपयुक्त कार्यक्षमता प्रदान करतात. प्रोग्रामचे असे भाग ऑब्जेक्ट्स वापरून मॉडेल केले जातात. त्यांच्या इंटरफेसचा समावेश आहे एक निश्चित संचपद्धती आणि गुणधर्म. इंटरफेसचा भाग असलेल्या गुणधर्मांना सार्वजनिक म्हणतात. बाकी, ज्यांना बाह्य कोड स्पर्श करू नये, त्यांना खाजगी म्हणतात.

बऱ्याच भाषा सार्वजनिक आणि खाजगी मालमत्तांमध्ये फरक करण्याची क्षमता प्रदान करतात आणि बाह्य कोडला खाजगीमध्ये प्रवेश करण्याची परवानगी देत ​​नाहीत. JavaScript, पुन्हा किमान दृष्टीकोन घेऊन, अद्याप तेथे नाही. ही भाषा जोडण्याचे काम सध्या सुरू आहे. म्हणून, JavaScript प्रोग्रामर ही कल्पना यशस्वीरित्या वापरतील. सामान्यतः, उपलब्ध इंटरफेसचे वर्णन दस्तऐवजीकरण किंवा टिप्पण्यांमध्ये केले जाते. मालमत्ता खाजगी आहेत हे दर्शविण्यासाठी मालमत्तेच्या नावाच्या सुरुवातीला अंडरस्कोर (_) लावणे देखील सामान्य आहे. अंमलबजावणीपासून इंटरफेस वेगळे करणे - छान कल्पना. याला सहसा एन्कॅप्सुलेशन म्हणतात.

गुणधर्म

कंस (...) असलेल्या ऑब्जेक्टला ऑब्जेक्ट शब्दशः म्हणतात. तुम्ही अशा कंसात (...) काही गुणधर्म ताबडतोब ठेवू शकता. उदाहरणार्थ, "की: मूल्य आणि याप्रमाणे" जोड्या:

वापरकर्ता = ( // ऑब्जेक्टचे नाव: "जॉन", // की "नाव" स्टोअर व्हॅल्यू "John) द्वारे" age: 30 // by key "age" store value 30 }.!}

कोलन ":" च्या आधी प्रॉपर्टीमध्ये एक की ("नाव" किंवा "आयडेंटिफायर" म्हणूनही ओळखली जाते) असते आणि तिच्या उजवीकडे एक मूल्य असते. वापरकर्ता ऑब्जेक्टमध्ये दोन गुणधर्म आहेत. परिणामी वापरकर्ता JavaScript ऑब्जेक्ट "नाव" आणि "वय" लेबल केलेल्या दोन स्वाक्षरी केलेल्या फायलींसह. तुम्ही त्यामधून कधीही फाइल्स जोडू, हटवू आणि वाचू शकता. डॉट नोटेशन वापरून प्रॉपर्टी व्हॅल्यूज ऍक्सेस केले जातात. ते कोणत्याही प्रकारचे असू शकते. आपण जोडू शकता बुलियन मूल्य. प्रॉपर्टी काढून टाकण्यासाठी, JavaScript ऑब्जेक्टच्या एरर केसवर डिलीट वापरा.

सर्व JavaScript त्रुटी ऑब्जेक्ट्स एरर ऑब्जेक्ट किंवा वारसा मिळालेल्या ऑब्जेक्टचे वंशज आहेत:

1. सिंटॅक्स एरर ऑब्जेक्टला एरर ऑब्जेक्टपासून वारसा मिळतो.
2. विशिष्ट प्रकारच्या सिंटॅक्स एरर ऑब्जेक्टची JSON पार्स त्रुटी.

अनुप्रयोग कसे हाताळतात हे समजून घेण्यासाठी आणखी खोलवर जाण्यासाठी JavaScript त्रुटी, Airbrake JavaScript शी अधिक चांगल्या प्रकारे परिचित व्हा - रिअल-टाइम ॲलर्टसाठी त्रुटी ट्रॅकिंग साधन आणि तुमच्या JavaScript कोडमध्ये काय चूक झाली याची झटपट अंतर्दृष्टी.

JavaScript ऑब्जेक्ट हटवण्यापूर्वी वापरकर्त्यास प्राप्त होणारे त्रुटी संदेश:

1. अक्षरशः स्ट्रिंगमधील खराब नियंत्रण वर्ण.
2. अक्षरशः स्ट्रिंगमधील वाईट वर्ण.
3. खराब युनिकोड आउटपुट.
4. वाईट सुटलेले पात्र.
5. अनटर्मिनेटेड स्ट्रिंग.
6. अनपेक्षित नॉन-न्यूमेरिक कोड.
7. दशांश बिंदू नंतर संख्या नाहीत.
8. अनटर्मिनेटेड फ्रॅक्शनल नंबर.
9. पदवी सूचकानंतर कोणतेही आकडे नाहीत.
10. घातांक चिन्हानंतर संख्या नाहीत.
11. घातांक भागाला संख्या नाही.
12. डेटाचा अनपेक्षित अंत.
13. अनपेक्षित कीवर्ड.
14. अनपेक्षित चिन्ह.
15. ऑब्जेक्टची सामग्री वाचताना डेटाचा शेवट.
16. अपेक्षित मालमत्तेचे नाव किंवा ")".

संगणकीय गुणधर्म

तुम्ही ऑब्जेक्ट अक्षरशः मध्ये चौरस कंस वापरू शकता. त्यांना गणना केलेले गुणधर्म म्हणतात. खाली एक उदाहरण दिले आहे.

गणना केलेल्या मालमत्तेचा अर्थ सोपा आहे: याचा अर्थ असा की मालमत्तेचे नाव फळावरून घेतले पाहिजे. म्हणून जर एखादा पाहुणा "सफरचंद" मध्ये प्रवेश करतो, तर पिशवी होईल (सफरचंद: 5). आपण चौरस कंसात अधिक जटिल अभिव्यक्ती वापरू शकता:

let fruit = "सफरचंद";

: 5 // bag.appleComputers = 5

चौकोनी कंस हे डॉट नोटेशनपेक्षा खूप शक्तिशाली आहेत. ते मालमत्तेची नावे आणि चलांना परवानगी देतात. पण ते लिहिण्यासही जास्त त्रासदायक आहेत. म्हणून बहुतेक वेळा, जेव्हा मालमत्तेची नावे ज्ञात आणि सोपी असतात, तेव्हा एक बिंदू वापरला जातो. आणि जर तुम्हाला काहीतरी अधिक क्लिष्ट हवे असेल तर स्क्वेअर ब्रॅकेटवर स्विच करा.

शब्द आरक्षण

व्हेरिएबलमध्ये 'फॉर', 'लेट', 'रिटर्न' इत्यादीसारख्या राखीव शब्दांपैकी एकाचे नाव असू शकत नाही. परंतु JavaScript ऑब्जेक्ट्सची क्रमवारी लावताना, असे कोणतेही बंधन नाही.

तत्वतः, कोणत्याही नावाला परवानगी आहे, परंतु एक विशेष आहे: ऐतिहासिक कारणांसाठी "__प्रोटो__" ला विशेष उपचार मिळतात. उदाहरणार्थ, तुम्ही ते ऑब्जेक्ट व्यतिरिक्त अन्य मूल्यावर सेट करू शकत नाही:

obj.__proto__ = 5;

इशारा(obj.__proto__); // हेतूनुसार कार्य केले नाही

तुम्ही कोडवरून पाहू शकता की, आदिम 5 चा उद्देश दुर्लक्षित केला आहे. जर ऑपरेटर एखाद्या ऑब्जेक्टमध्ये अनियंत्रित की-व्हॅल्यू जोड्या संग्रहित करू इच्छित असेल आणि अभ्यागताला की निर्दिष्ट करण्यास अनुमती देत ​​असेल तर हे त्रुटी आणि अगदी भेद्यता देखील असू शकते. या प्रकरणात, अभ्यागत की म्हणून "प्रोटो" निवडू शकतो आणि ऑब्जेक्टमध्ये JavaScript जोडू शकतो. __प्रोटो__ ने हाताळलेल्या वस्तूंना नियमित गुणधर्म बनवण्याचा एक मार्ग आहे. डेटा स्ट्रक्चर्सचा दुसरा नकाशा देखील आहे जो अनियंत्रित की ला समर्थन देतो.

पूर्णांक गुणधर्म

येथे "पूर्णांक गुणधर्म" या शब्दाचा अर्थ अशी स्ट्रिंग आहे जी बदलाशिवाय पूर्णांकातून रूपांतरित केली जाऊ शकते. म्हणून, उदाहरणार्थ, "49" हे पूर्णांक गुणधर्माचे नाव आहे कारण जेव्हा ते पूर्णांकात रूपांतरित केले जाते आणि पुन्हा परत केले जाते तेव्हा ते समान असते. पण “+49” आणि “1.2” असे नाहीत. दुसरीकडे, जर की पूर्णांक नसतील, तर त्या तयार केलेल्या क्रमाने सूचीबद्ध केल्या जातात. खाली उदाहरण.

डायलिंग कोडच्या समस्येचे निराकरण करण्यासाठी, तुम्ही कोड अपूर्ण करून "फसवणूक" करू शकता. प्रत्येक कोडच्या आधी "+" (अधिक चिन्ह) जोडणे पुरेसे आहे. आता ते इच्छेप्रमाणे कार्य करेल.

ऑब्जेक्ट्स आणि प्रिमिटिव्समधील फरक म्हणजे ते "संदर्भानुसार" संग्रहित आणि कॉपी केले जातात. आदिम मूल्येनियुक्त केले जातात आणि "पूर्णांक मूल्य म्हणून" कॉपी केले जातात. व्हेरिएबल ऑब्जेक्ट स्वतः किंवा त्याचा "संदर्भ" ऐवजी "मेमरीमधील पत्ता" संग्रहित करतो. तुम्ही कोणत्याही व्हेरिएबलमध्ये प्रवेश करण्यासाठी आणि त्यातील सामग्री बदलण्यासाठी वापरू शकता.

वरील उदाहरण दर्शविते की लॉग इन करण्यासाठी एकच ऑब्जेक्ट आणि प्रशासक आहे. नंतर, नंतर वेगळी की (वापरकर्ता) वापरली असल्यास, वापरकर्त्याला बदल लक्षात येतील.

ऑब्जेक्ट्ससाठी समानता ऑपरेटर == आणि कठोर समानता === त्याच प्रकारे कार्य करतात. दोन वस्तू समान असतील तरच ते समान असतात. obj1 > obj2 सारख्या तुलनांसाठी किंवा आदिम obj == 5 शी तुलना करण्यासाठी, वस्तूंचे रूपांतर आदिममध्ये केले जाते. खरे सांगायचे तर, अशा तुलना फार क्वचितच आवश्यक असतात आणि सहसा कोडिंग त्रुटीचा परिणाम असतो.

JavaScript ऑब्जेक्ट प्रमाणीकरण

ऑब्जेक्ट्सना कोणत्याही मालमत्तेमध्ये प्रवेश असतो. तथापि, जर ते अजिबात अस्तित्वात नसेल, तर ती त्रुटी असणार नाही. केवळ अस्तित्वात नसलेल्या मालमत्तेमध्ये प्रवेश करणे अपरिभाषित परत मिळते. हे मालमत्तेची चाचणी करण्याचा आणि अपरिभाषित एकाशी तुलना करण्याचा एक सामान्य मार्ग प्रदान करते. खाली एक उदाहरण आहे.

अपरिभाषित संचयित केलेल्या गुणधर्मांसाठी "इन" वापरणे. सहसा कठोर "=== अपरिभाषित" तुलना तपासणी चांगले कार्य करते. एक विशेष केस आहे जिथे ते अयशस्वी होते आणि "इन" योग्यरित्या कार्य करते. जेव्हा एखाद्या वस्तूची मालमत्ता अस्तित्वात असते परंतु अपरिभाषित राहते तेव्हा असे होते.

वरील कोडमध्ये, obj.test मालमत्ता तांत्रिकदृष्ट्या अस्तित्वात आहे. त्यामुळे इन ऑपरेटर योग्यरित्या कार्य करते. अशा परिस्थिती फार दुर्मिळ आहेत कारण अपरिभाषित सहसा नियुक्त केले जात नाही. बहुतेक शून्य "अज्ञात" किंवा "रिक्त" मूल्ये वापरली जातात. अशा प्रकारे, इन ऑपरेटर प्रभावीपणे कोडमध्ये अतिथी आहे.

"for..in" लूप

ऑब्जेक्ट पासून ऑब्जेक्ट पर्यंत सर्व कळा नेव्हिगेट करण्यासाठी, आहे विशेष फॉर्मपळवाट: साठी..इन. ही for(;;) रचना पेक्षा पूर्णपणे वेगळी गोष्ट आहे.

खाली एक उदाहरण आहे.

कृपया लक्षात घ्या की सर्व "साठी" कन्स्ट्रक्टर तुम्हाला लूपमधील लूपिंग व्हेरिएबल लेट की म्हणून घोषित करण्याची परवानगी देतात. वैकल्पिकरित्या, तुम्ही त्याऐवजी भिन्न व्हेरिएबल नाव, की वापरू शकता.

उदाहरणार्थ, for(let prop in obj) देखील मोठ्या प्रमाणावर वापरले जाते.

एक पर्यायी "स्क्वेअर ब्रॅकेट" आहे जो कोणत्याही स्ट्रिंगसह कार्य करतो.

येथे मुद्दा आवश्यक आहे की JavaScript ऑब्जेक्टच्या की वैध व्हेरिएबल आयडेंटिफायर असणे आवश्यक आहे, म्हणजे तेथे कोणतेही रिक्त स्थान किंवा इतर प्रतिबंध नाहीत. कंसातील ओळ योग्यरित्या उद्धृत केली आहे याची खात्री करण्यासाठी काळजी घेणे आवश्यक आहे. स्क्वेअर ब्रॅकेट्स व्हेरिएबलमधील शाब्दिक स्ट्रिंगच्या विरूद्ध, कोणत्याही अभिव्यक्तीच्या परिणामातून गुणधर्म नाव मिळविण्याचा मार्ग देखील प्रदान करतात:

let key = "पक्षी आवडतात";

// user as same["likes birds"] = खरे;

वापरकर्ता = खरे.

येथे की व्हेरिएबलची रनटाइमच्या वेळी गणना केली जाऊ शकते आणि वापरकर्त्याच्या इनपुटवर अवलंबून असते आणि नंतर प्रॉपर्टी ऍक्सेस करण्यासाठी वापरली जाते. हे प्रोग्रामरना अधिक लवचिकता देते. डॉट नोटेशन त्याच प्रकारे वापरले जाऊ शकत नाही, कारण ते JavaScript ऑब्जेक्टवर पुनरावृत्ती करेल. खाली एक उदाहरण आहे.

कॉन्स्ट ऑब्जेक्ट

घोषित कॉन्स्ट ऑब्जेक्ट सुधारित केले जाऊ शकते. खाली एक उदाहरण दिले आहे.

ओळीतील JavaScript ऑब्जेक्ट (*) एरर टाकेल असे वाटू शकते, परंतु तसे नाही. कारण const वापरकर्त्याचे मूल्य स्वतःच कॅप्चर करते. आणि येथे वापरकर्ता नेहमी एकाच वस्तूचा संदर्भ ठेवतो. ओळ (*) ऑब्जेक्टच्या आत जाते, ती वापरकर्त्याला पुन्हा नियुक्त केलेली नाही. आपण वापरकर्ता आणि दुसरे काहीतरी सेट करण्याचा प्रयत्न केल्यास Const त्रुटी देईल. क्लोनिंग आणि विलीनीकरण, Object.assign त्याच ऑब्जेक्टला डुप्लिकेट करणे आवश्यक असल्यास त्याचा दुसरा संदर्भ तयार करते. हे देखील शक्य आहे, परंतु थोडे अधिक कठीण आहे कारण JavaScript मध्ये अंगभूत पद्धत नाही. खरं तर, हे क्वचितच आवश्यक आहे. संदर्भानुसार कॉपी करणे बहुतेक प्रकरणांमध्ये वापरले जाते. परंतु जर तुम्हाला याची खरोखर गरज असेल, तर तुम्हाला JavaScript ऑब्जेक्ट तयार करणे आवश्यक आहे आणि विद्यमान रचनेची प्रतिकृती तयार करणे आवश्यक आहे, त्याचे गुणधर्म आदिम स्तरावर कॉपी करणे आवश्यक आहे. खाली एक उदाहरण आहे.

आणि यासाठी तुम्ही Object.assign पद्धत देखील वापरू शकता. arguments dest आणि src1, ..., srcN हे ऑब्जेक्ट आहेत. हे सर्व ऑब्जेक्ट्सचे गुणधर्म src1, ..., srcNINTO dest कॉपी करते. दुसऱ्या शब्दांत, सर्व वितर्कांचे गुणधर्म, दुसऱ्यापासून सुरू होणारे, 1 ला कॉपी केले जातात. मग ते गंतव्यस्थानावर परत येते. उदाहरणार्थ, आपण अनेक ऑब्जेक्ट्स एकामध्ये एकत्र करण्यासाठी ते वापरू शकता.

आणि साधे क्लोन लूप बदलण्यासाठी तुम्ही Object.assign देखील वापरू शकता. हे वापरकर्त्याचे सर्व गुणधर्म रिकाम्या ऑब्जेक्टवर कॉपी करते आणि लूपप्रमाणेच, परंतु लहान परत करते. आत्तापर्यंत, असे गृहीत धरले गेले आहे की सर्व वापरकर्ता गुणधर्म आदिम आहेत. परंतु गुणधर्म इतर वस्तूंचे संदर्भ असू शकतात.

याचे निराकरण करण्यासाठी, तुम्हाला क्लोन लूप वापरणे आवश्यक आहे जे प्रत्येक वापरकर्ता मूल्य तपासते आणि, जर ते ऑब्जेक्ट असेल, तर त्याची रचना प्रतिरूपित करते. याला "डीप क्लोनिंग" म्हणतात.

एक मानक डीप क्लोनिंग अल्गोरिदम आहे जो वरील केस आणि अधिक जटिल केसेस हाताळतो ज्याला स्ट्रक्चर्ड क्लोनिंग अल्गोरिदम म्हणतात. चाक पुन्हा शोधणे टाळण्यासाठी, तुम्ही lodash JavaScript लायब्ररीमधून कार्यरत अंमलबजावणी वापरू शकता, या पद्धतीला _.cloneDeep(obj) म्हणतात.

प्रगत पद्धती

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

प्रगत ऑब्जेक्ट पद्धती संकल्पनांना सामोरे जातात ज्या JavaScripting मध्ये क्वचितच वापरल्या जातात. हे असे आहे कारण सामान्य परिस्थितींमध्ये या शक्तिशाली वैशिष्ट्यांची आवश्यकता नसते. यापैकी काही पद्धती जुन्या ब्राउझरमध्ये कार्य करू शकत नाहीत, जसे की Netscape 4 च्या सुरुवातीच्या प्रकाशन.

प्रोटोटाइप JavaScript ऑब्जेक्ट्स आणि सर्व मायसर्कल पद्धती तयार करण्यासाठी वापरला जाऊ शकतो, फक्त नवीन नाही. याचा संमिश्र कार्यप्रदर्शन प्रभाव आहे. त्यांना प्रत्येक ऑब्जेक्टच्या उदाहरणासाठी पद्धतींच्या वेगळ्या प्रती संग्रहित करण्याची गरज नाही, त्यामुळे त्यांना ऑपरेट करण्यासाठी कमी मेमरी आवश्यक असू शकते, परंतु ब्राउझरने त्यांना शोधण्यासाठी वर्तमान आणि पालक स्कोप शोधणे आवश्यक आहे. यामुळे अत्यंत विलंब होऊ शकतो. सामान्यतः, वापरकर्त्याने कार्यप्रदर्शनावर निर्णय घेण्याऐवजी कोडसाठी योग्य ते वापरावे, जोपर्यंत ते अतिशय विशिष्ट नियंत्रित वातावरणाशी व्यवहार करत नाहीत.

खरे परत

काही प्रकरणांमध्ये, एखाद्या वस्तूच्या मालमत्तेला वस्तू किंवा प्रोटोटाइप साखळीत कुठेतरी बंधनकारक असणे आवश्यक असू शकते. JavaScript मध्ये, सर्व ऑब्जेक्ट hasOwnProperty पद्धत वापरतात, जी ती प्रॉपर्टी वैयक्तिक ऑब्जेक्टच्या उदाहरणाशी बांधील असल्यास ती सत्य दर्शवते. या प्रकरणात, ऑब्जेक्टच्या कन्स्ट्रक्टरकडे ऑब्जेक्टच्या उदाहरणाप्रमाणेच समान मूल्य आहे की नाही हे तपासणे शक्य होते. यासह वेगळे JavaScript ऑब्जेक्ट गुणधर्म असल्यास हे चुकीचे परिणाम देऊ शकते समान मूल्यऑब्जेक्ट उदाहरण आणि सर्किट प्रोटोटाइप दोन्हीसाठी. hasOwnProperty पद्धत एकच पॅरामीटर घेते - स्ट्रिंग म्हणून प्रॉपर्टीचे नाव.

तुम्ही अशाच प्रकारे खाजगी पद्धती तयार करू शकता. हे फक्त एक फंक्शन आहे जे कन्स्ट्रक्टर फंक्शनमध्ये तयार केले जाते. हे काहींना गोंधळात टाकणारे वाटू शकते, परंतु ते कसे कार्य करते. खाजगी फंक्शन केवळ कन्स्ट्रक्टरद्वारे किंवा ओळीवर परिभाषित केलेल्या पद्धतींद्वारे कॉल केले जाऊ शकते. सार्वजनिक बांधकामकर्त्याला नियुक्त केल्यास आणि वापरून प्रवेश केल्यास ते सार्वजनिक पद्धती म्हणून वापरले जाऊ शकतात खुल्या पद्धती Javascript वस्तू.

फंक्शन myob() ( फंक्शन cantBeSeen() ( alert(secretValue);

) var secretValue = "";

this.method1 = function () ( secretValue = "कोणतेही आश्चर्य नाही";!}

this.method2 = cantBeSeen;

) var oneOb = नवीन myob();

oneOb.method1();

// अलर्ट "कोणतेही आश्चर्य नाही" oneOb.method2();

// अलर्ट "कोणतेही आश्चर्य नाही".

कमांड टेम्पलेट

कमांड ऑब्जेक्ट्स ऑब्जेक्ट्सकडून विनंती जारी करणाऱ्या आणि प्रत्यक्षात विनंतीवर प्रक्रिया करणाऱ्या सिस्टमला वेगळे करून सैलपणे जोडलेल्या सिस्टमला परवानगी देतात. या विनंत्यांना इव्हेंट म्हणतात आणि विनंत्यांवर प्रक्रिया करणाऱ्या कोडला इव्हेंट हँडलर म्हणतात.

समजा तुम्ही क्लिपबोर्ड कट, कॉपी आणि पेस्ट क्रियांना समर्थन देणारे अनुप्रयोग तयार करत आहात. या क्रिया संपूर्ण अनुप्रयोगात वेगवेगळ्या प्रकारे ट्रिगर केल्या जाऊ शकतात: मेनू सिस्टमद्वारे, संदर्भ मेनूद्वारे, उदाहरणार्थ क्लिक करून उजवे बटणमजकूर फील्ड किंवा कीबोर्ड शॉर्टकटवर माऊस. कमांड ऑब्जेक्ट्स तुम्हाला या क्रियांची प्रक्रिया केंद्रीकृत करण्याची परवानगी देतात, प्रत्येक ऑपरेशनसाठी एक, जेव्हा सर्व कट विनंत्यांवर प्रक्रिया करण्यासाठी फक्त एक कमांड आवश्यक असते, सर्व कॉपी विनंत्यांसाठी एक आणि सर्व पेस्ट विनंत्यांसाठी एक.

कारण संघ सर्व प्रक्रिया केंद्रीकृत करतात, ते संपूर्ण अनुप्रयोगासाठी पूर्ववत कार्ये हाताळण्यात देखील गुंतलेले असतात. आधुनिक वापरातून लक्षणीय सुधारणा करता येतात JavaScript पद्धतीपरिणामी अधिक कार्यक्षम, विश्वासार्ह आणि देखभाल करण्यायोग्य अनुप्रयोग.

हे कसे करायचे हे जाणून घेण्यासाठी, तुम्ही JavaScript + jQuery टेम्पलेट वापरू शकता. या अनन्य पॅकेजमध्ये नेमस्पेस, प्रोटोटाइप, मॉड्यूल, फंक्शन ऑब्जेक्ट्स, क्लोजर, निनावी फंक्शन्स आणि बरेच काही यासारख्या अधिक प्रगत वैशिष्ट्यांचा वापर करून सर्व GoF टेम्पलेट्ससाठी ऑप्टिमाइझ केलेले JavaScript समाविष्ट आहे. वापरकर्त्यांना JavaScript टेम्पलेट्स, jQuery टेम्पलेट्स आणि टेम्पलेट आर्किटेक्चरसाठी नवीनतम साधने आणि तंत्रांची आवश्यकता असल्यास, हे सर्वोत्तम पर्यायवापर या पॅकेजमध्ये JavaScript विकसकांसाठी मौल्यवान, अद्ययावत माहिती आहे. काय समाविष्ट आहे ते येथे आहे:

1. JavaScript-अनुकूलित GoF टेम्पलेट्स.
2. आधुनिक JavaScript डिझाइन नमुने.
3. मॉडेल-दृश्य डिझाइन नमुने.
4. jQuery डिझाइन टेम्पलेट्स.
5. JavaScript मुहावरेचे आर्किटेक्चरल नमुने.
6. उदाहरण अर्ज (MVC, SPA, इ.)

सुरुवातीच्या प्रोग्रामरसाठी JavaScript ऑब्जेक्ट सिंटॅक्सच्या प्रस्तावित मूलभूत गोष्टी अतिशय महत्त्वाच्या आहेत. प्रथम वस्तू समजून घेतल्या पाहिजेत, त्यानंतर ऑब्जेक्ट ओरिएंटेड प्रोग्रामिंगचे ज्ञान असेल. या सामग्रीचे सखोल ज्ञान असणे महत्त्वाचे आहे कारण ते उर्वरित JavaScript भाषेचा पाया म्हणून काम करते.

JavaScript ऑब्जेक्ट्स

मागील मध्ये JavaScript धडेतुम्ही पाहिले आहे की अनेक अंगभूत वस्तू आहेत जसे की स्ट्रिंग, तारीख, ॲरे आणि इतर. या अंगभूत वस्तूंव्यतिरिक्त, आपण आपले स्वतःचे देखील तयार करू शकता.

ऑब्जेक्ट हा गुणधर्म आणि पद्धतींचा एक विशेष प्रकार असलेला डेटा असतो.

चला एका उदाहरणाने हे स्पष्ट करू: व्यक्ती ही एक वस्तू आहे. गुणधर्म ही वस्तूशी संबंधित मूल्ये असतात.

गुणधर्म

व्यक्तीच्या गुणधर्मांमध्ये नाव, उंची, वजन, वय, त्वचेचा रंग, डोळ्यांचा रंग इ. सर्व व्यक्तींमध्ये हे गुणधर्म आहेत, परंतु या गुणधर्मांची मूल्ये एका व्यक्तीपासून दुसऱ्या व्यक्तीमध्ये भिन्न असतील. वस्तूंच्याही पद्धती असतात. पद्धती म्हणजे वस्तूंवर करता येणाऱ्या क्रिया. व्यक्ती पद्धतींमध्ये खाणे(), झोप(), काम(), खेळ(), इ.

ऑब्जेक्ट प्रॉपर्टी ऍक्सेस करण्यासाठी सिंटॅक्स आहे:

वरील कोड खालील आउटपुट व्युत्पन्न करेल:टिप्पणी:

पद्धतीला दिलेले पॅरामीटर्स कुरळे ब्रेसेसमध्ये बंद केलेले आहेत.

personObj ऑब्जेक्टची sleep() पद्धत कॉल करण्याचे उदाहरण:

पर्यायी वाक्यरचना (ऑब्जेक्ट लिटरल वापरुन):

2. ऑब्जेक्ट कन्स्ट्रक्टर तयार करा

this.eyecolor=eyecolor;

फंक्शनच्या आत, तुम्ही हे.प्रॉपर्टीनेम कंस्ट्रक्ट वापरून गुणधर्मांना मूल्ये नियुक्त करणे आवश्यक आहे. या वाक्यरचनेचे कारण असे आहे की तुम्ही एका वेळी ऑब्जेक्टचे (व्यक्तीचे) एकापेक्षा जास्त उदाहरण वापरत आहात (आणि तुम्ही कोणत्या विशिष्ट वस्तूशी व्यवहार करत आहात हे स्पष्ट असणे आवश्यक आहे). म्हणून, "हा" शब्द विशिष्ट - वर्तमान ऑब्जेक्टकडे निर्देश करतो ज्याचे गुणधर्म तुम्ही कन्स्ट्रक्टरमध्ये सुरू करता.

एकदा तुम्ही ऑब्जेक्टचा कन्स्ट्रक्टर लिहिल्यानंतर, तुम्ही ऑब्जेक्टची नवीन उदाहरणे तयार करू शकता, जसे की:

लक्षात घ्या की पद्धती ही केवळ ऑब्जेक्ट्सशी जोडलेली नियमित कार्ये आहेत. पुढे आपण newlastname() फंक्शनचा मुख्य भाग लिहावा.

ऑब्जेक्ट म्हणजे गुणधर्मांचा अक्रमित संग्रह. प्रॉपर्टी हा ऑब्जेक्टचा एक भाग आहे जो व्हेरिएबलचे अनुकरण करतो. मालमत्तेमध्ये नाव आणि मूल्य असते.

• JavaScript मध्ये ऑब्जेक्ट्सच्या तीन श्रेणी आहेत:मूलभूत प्रकारच्या वस्तू
• ECMAScript तपशीलामध्ये परिभाषित केलेल्या वस्तू आहेत. उदाहरणार्थ, Array, Function, Date किंवा RegExp प्रकारातील ऑब्जेक्ट्स बेस टाईपचे ऑब्जेक्ट आहेत.रनटाइम ऑब्जेक्ट्स
• रनटाइम वातावरणात (जसे की ब्राउझर) परिभाषित केलेल्या वस्तू आहेत. उदाहरणार्थ, HTMLElement प्रकारातील ऑब्जेक्ट्स रनटाइम ऑब्जेक्ट्स आहेत.सानुकूल वस्तू अंमलबजावणीच्या परिणामी तयार केलेली कोणतीही वस्तू आहेप्रोग्राम कोड

JavaScript.

ऑब्जेक्ट तयार करणे

ऑब्जेक्ट लिटरल म्हणजे कर्ली ब्रेसेसमध्ये बंद केलेली शून्य किंवा अधिक गुणधर्मांची (नाव: मूल्य जोड्या) स्वल्पविरामाने विभक्त केलेली सूची आहे. मालमत्तेचे नाव कोणतेही वैध अभिज्ञापक, स्ट्रिंग लिटरल (रिक्त स्ट्रिंग अनुमत आहे) किंवा संख्या असू शकते. अंकीय गुणधर्मांची नावे आपोआप स्ट्रिंगमध्ये रूपांतरित केली जातात. गुणधर्म मूल्य हे कोणत्याही प्रकारचे किंवा अभिव्यक्तीचे मूल्य असू शकते (या प्रकरणात गुणधर्म मूल्य अभिव्यक्तीचे मूल्यमापन करण्याचा परिणाम असेल):

// रिक्त ऑब्जेक्ट तयार करा var o = (); // तीन गुणधर्मांसह एक ऑब्जेक्ट तयार करा var वापरकर्ता = ( नाव: "होमर", "वय": 45, 1: खरे);

नवीन ऑपरेटर वापरून ऑब्जेक्ट तयार करणे:

Var o = नवीन ऑब्जेक्ट();

ऑब्जेक्टसह ऑपरेशन्स

ऑब्जेक्ट्ससह केलेले मुख्य ऑपरेशन नवीन गुणधर्म जोडत आहेत, आधीच बदलत आहेत विद्यमान गुणधर्म, गुणधर्म काढून टाकणे आणि गुणधर्मांमध्ये प्रवेश करणे.

तुम्ही मालमत्तेला मूल्य नियुक्त करून ऑब्जेक्टमध्ये नवीन गुणधर्म जोडू शकता. मालमत्तेला मूल्य नियुक्त करण्यासाठी, त्यात प्रवेश करणे आवश्यक आहे. प्रॉपर्टी ऍक्सेस करण्यासाठी, ऍक्सेस ऑपरेटरपैकी एक वापरा: . (डॉट) किंवा (चौरस कंस):

मालमत्तेमध्ये प्रवेश करणे आणि त्याचे मूल्य बदलणे अगदी त्याच प्रकारे केले जाते (ॲक्सेस ऑपरेटर वापरून):

Var o = (x:5); इशारा(o.x); // प्रॉपर्टी अलर्टमध्ये प्रवेश करणे(o["x"]); // मालमत्तेमध्ये प्रवेश करणे o.x = 10; // मूल्य बदला

डिलीट ऑपरेटर वापरून मालमत्ता काढून टाकली जाते:

Var o = (x:5); इशारा (o मध्ये "x"); // खरे हटवा o.x; इशारा (o मध्ये "x"); // खोटे

ऑब्जेक्टच्या गुणधर्मांद्वारे पुनरावृत्ती करण्यासाठी, फॉर-इन लूप वापरा:

Var obj = (x: 5, y: 10, str: "हाय!"); साठी (var prop in obj) ( alert(prop); )

ऑब्जेक्ट पद्धती

ज्या गुणधर्माचे मूल्य फंक्शन असते त्याला पद्धत म्हणतात. पद्धत कॉल करणे हे नियमित फंक्शनला कॉल करण्यासारखेच केले जाते - ऑपरेटर () (कॉल ऑपरेटर) वापरून:

Var o = ( sayHi: function() ( अलर्ट("हॅलो!"); )); o.sayHi(); // "हॅलो!"

मेथडमधील ऑब्जेक्टच्या गुणधर्मांमध्ये प्रवेश करण्यासाठी, हा कीवर्ड वापरा. यात ऑब्जेक्टचा संदर्भ आहे ज्यासह पद्धत कॉल केली गेली होती:

Var o = ( नाव: "होमर", म्हणायचे नाव: फंक्शन() ( अलर्ट(हे. नाव); )); o.sayName(); // "होमर"

या कीवर्डऐवजी, आपण ऑब्जेक्टचे नाव थेट वापरू शकता, परंतु हे फार सोयीचे नाही, कारण ऑब्जेक्टचे नाव बदलल्यास, आपल्याला पद्धतींमध्ये नाव देखील बदलावे लागेल:

Var o = ( नाव: "होमर", म्हणायचे नाव: फंक्शन() ( अलर्ट(ओ.नाम); )); o.sayName(); // "होमर"

शेवटचे अपडेट: ०४/०८/२०१८

ऑब्जेक्ट-ओरिएंटेड प्रोग्रामिंग हे आज ऍप्लिकेशन डेव्हलपमेंटमधील प्रबळ प्रतिमानांपैकी एक आहे आणि JavaScript मध्ये देखील आपण OOP चा पूर्ण फायदा घेऊ शकतो. त्याच वेळी, JavaScript च्या संबंधात, ऑब्जेक्ट-ओरिएंटेड प्रोग्रामिंगमध्ये काही वैशिष्ट्ये आहेत.

वस्तू

मागील विषयांमध्ये, आम्ही आदिम डेटासह कार्य केले - संख्या, स्ट्रिंग, परंतु डेटा नेहमी दर्शवत नाही आदिम प्रकार. उदाहरणार्थ, जर आपल्या प्रोग्राममध्ये आपल्याला एखाद्या व्यक्तीचे नाव, वय, लिंग इत्यादींचे सार वर्णन करायचे असेल तर नैसर्गिकरित्या आपण एखाद्या व्यक्तीचे सार संख्या किंवा स्ट्रिंग म्हणून दर्शवू शकणार नाही. व्यक्तीचे योग्य वर्णन करण्यासाठी आम्हाला काही ओळी किंवा अंकांची आवश्यकता असेल. या संदर्भात, एक व्यक्ती एक जटिल जटिल संरचना म्हणून कार्य करेल, ज्यामध्ये वैयक्तिक गुणधर्म असतील - वय, उंची, नाव, आडनाव इ.

अशा संरचनांसह कार्य करण्यासाठी, JavaScript वापरते. प्रत्येक ऑब्जेक्ट त्याच्या स्थितीचे वर्णन करणारे गुणधर्म आणि त्याच्या वर्तनाचे वर्णन करणाऱ्या पद्धती संचयित करू शकते

नवीन ऑब्जेक्ट तयार करणे

नवीन ऑब्जेक्ट तयार करण्याचे अनेक मार्ग आहेत.

ऑब्जेक्ट कन्स्ट्रक्टर वापरण्याचा पहिला मार्ग आहे:

वर वापरकर्ता = नवीन ऑब्जेक्ट ();

IN या प्रकरणातऑब्जेक्टला यूजर म्हणतात. हे var कीवर्ड वापरून कोणत्याही नियमित व्हेरिएबलप्रमाणेच परिभाषित केले आहे.

नवीन ऑब्जेक्ट() अभिव्यक्ती कन्स्ट्रक्टरला कॉल दर्शवते, एक फंक्शन जे नवीन ऑब्जेक्ट तयार करते. नवीन ऑपरेटरचा वापर कन्स्ट्रक्टरला कॉल करण्यासाठी केला जातो. कन्स्ट्रक्टरला कॉल करणे हे एक नियमित फंक्शन कॉल करण्यासारखे आहे.

ऑब्जेक्ट तयार करण्याचा दुसरा मार्ग म्हणजे कुरळे ब्रेसेस वापरणे:

वर वापरकर्ता = ();

आज, दुसरी पद्धत अधिक सामान्य आहे.

ऑब्जेक्ट गुणधर्म

एखादी वस्तू तयार केल्यानंतर, आपण त्यावर गुणधर्म परिभाषित करू शकतो. प्रॉपर्टी डिफाईन करण्यासाठी, तुम्हाला ऑब्जेक्टच्या नावानंतर प्रॉपर्टीचे नाव निर्दिष्ट करणे आवश्यक आहे, बिंदूने विभक्त केले आहे आणि त्यास एक मूल्य नियुक्त करणे आवश्यक आहे:

वर वापरकर्ता = (); user.name = "टॉम"; user.age = 26;

या प्रकरणात, दोन गुणधर्मांचे नाव आणि वय घोषित केले जाते आणि संबंधित मूल्ये नियुक्त केली जातात. त्यानंतर, आम्ही या गुणधर्मांचा वापर करू शकतो, उदाहरणार्थ, त्यांची मूल्ये कन्सोलमध्ये प्रदर्शित करा:

Console.log(user.name); console.log(user.age);

ऑब्जेक्ट परिभाषित करताना आपण गुणधर्म देखील परिभाषित करू शकता:

Var वापरकर्ता = (नाव: "टॉम", वय: 26);

या प्रकरणात, मालमत्तेला मूल्य नियुक्त करण्यासाठी कोलन वर्ण वापरला जातो आणि गुणधर्म व्याख्येनंतर स्वल्पविराम (अर्धविराम ऐवजी) ठेवला जातो.

याव्यतिरिक्त, गुणधर्म परिभाषित करण्यासाठी एक शॉर्टकट मार्ग आहे:

वार नाव = "टॉम"; var वय = 34; var वापरकर्ता = (नाव, वय); console.log(user.name); // Tom console.log(user.age); // ३४

या प्रकरणात, व्हेरिएबल्सची नावे देखील ऑब्जेक्टच्या गुणधर्मांची नावे आहेत. आणि अशा प्रकारे आपण अधिक जटिल डिझाइन तयार करू शकता:

वार नाव = "टॉम"; var वय = 34; var वापरकर्ता = (नाव, वय); var शिक्षक = (वापरकर्ता, कोर्स: "जावास्क्रिप्ट"); console.log(teacher.user); // (नाव: "टॉम", वय: 34) console.log(teacher.course); // JavaScript

ऑब्जेक्ट पद्धती

ऑब्जेक्टच्या पद्धती त्याचे वर्तन किंवा ती करत असलेल्या क्रिया परिभाषित करतात. पद्धती ही कार्ये आहेत. उदाहरणार्थ, एक पद्धत परिभाषित करूया जी एखाद्या व्यक्तीचे नाव आणि वय दर्शवेल:

वर वापरकर्ता = (); user.name = "टॉम"; user.age = 26; user.display = function())( console.log(user.name); console.log(user.age); ); // पद्धत कॉल user.display();

फंक्शन्सप्रमाणे, पद्धती प्रथम परिभाषित केल्या जातात आणि नंतर कॉल केल्या जातात.

ऑब्जेक्ट परिभाषित करताना पद्धती देखील थेट परिभाषित केल्या जाऊ शकतात:

वर वापरकर्ता = ( नाव: "टॉम", वय: 26, प्रदर्शन: कार्य())( console.log(this.name); console.log(this.age); ));

गुणधर्मांप्रमाणे, कोलन वापरून पद्धतीला फंक्शन संदर्भ नियुक्त केला जातो.

ऑब्जेक्टमधील गुणधर्म किंवा त्या ऑब्जेक्टच्या पद्धतींमध्ये प्रवेश करण्यासाठी, हा कीवर्ड वापरला जातो. याचा अर्थ वर्तमान ऑब्जेक्टचा संदर्भ आहे.

तुम्ही कोलन आणि फंक्शन वगळून पद्धती परिभाषित करण्यासाठी शॉर्टहँड मार्ग देखील वापरू शकता:

Var वापरकर्ता = ( नाव: "टॉम", वय: 26, प्रदर्शन())( console.log(this.name, this.age); ), move(place)( console.log(this.name, "ला जातो " , ठिकाण); user.display(); // टॉम 26 user.move("दुकान"); // टॉम दुकानात जातो

ॲरे सिंटॅक्स

तसेच आहे पर्यायी मार्गॲरे सिंटॅक्स वापरून गुणधर्म आणि पद्धती परिभाषित करणे:

वर वापरकर्ता = (); user["name"] = "टॉम"; वापरकर्ता["वय"] = २६; user["display"] = function())( console.log(user.name); console.log(user.age); ); // पद्धत वापरकर्त्याला कॉल करणे["डिस्प्ले"]();

प्रत्येक मालमत्तेचे किंवा पद्धतीचे नाव अवतरण चिन्हे आणि चौरस कंसात बंद केले आहे, त्यानंतर त्याला एक मूल्य देखील नियुक्त केले आहे. उदाहरणार्थ, वापरकर्ता["वय"] = २६ .

या गुणधर्म आणि पद्धतींमध्ये प्रवेश करताना, तुम्ही एकतर डॉट नोटेशन (user.name) वापरू शकता किंवा वापरू शकता: user["name"]

गुणधर्म आणि पद्धती म्हणून स्ट्रिंग्स

हे देखील लक्षात घेतले पाहिजे की ऑब्जेक्ट गुणधर्म आणि पद्धतींची नावे नेहमी स्ट्रिंग असतात. म्हणजेच, आपण ऑब्जेक्टची मागील व्याख्या याप्रमाणे पुन्हा लिहू शकतो:

Var user = ( "नाव": "टॉम", "वय": 26, "डिस्प्ले": फंक्शन())( console.log(user.name); console.log(user.age); )); // पद्धत कॉल user.display();

एकीकडे, दोन व्याख्यांमध्ये फरक नाही. दुसरीकडे, अशी प्रकरणे आहेत जिथे शीर्षक एका ओळीत संलग्न केल्याने मदत होऊ शकते. उदाहरणार्थ, जर मालमत्तेच्या नावामध्ये स्पेसने विभक्त केलेले दोन शब्द असतील:

Var user = ( नाव: "टॉम", वय: 26, "पूर्ण नाव": "टॉम जॉन्स", "डिस्प्ले माहिती": फंक्शन())( console.log(user.name); console.log(user.age) ); console.log(वापरकर्ता["पूर्ण नाव"]); वापरकर्ता["माहिती प्रदर्शित करा"]();

केवळ या प्रकरणात, अशा गुणधर्म आणि पद्धतींमध्ये प्रवेश करण्यासाठी, आपण ॲरे सिंटॅक्स वापरणे आवश्यक आहे.

गुणधर्म काढून टाकत आहे

वर आपण ऑब्जेक्टमध्ये नवीन गुणधर्म कसे जोडू शकतो ते पाहिले. तथापि, आम्ही डिलीट ऑपरेटर वापरून गुणधर्म आणि पद्धती देखील हटवू शकतो. आणि जोडण्याप्रमाणे, आपण गुणधर्म दोन प्रकारे काढू शकतो. पहिला मार्ग म्हणजे डॉट नोटेशन वापरणे:

ऑब्जेक्ट.प्रॉपर्टी हटवा

किंवा ॲरे सिंटॅक्स वापरा:

ऑब्जेक्ट हटवा["मालमत्ता"]

उदाहरणार्थ, मालमत्ता काढून टाकूया:

वर वापरकर्ता = (); user.name = "टॉम"; user.age = 26; user.display = function())( console.log(user.name); console.log(user.age); ); console.log(user.name); // टॉम user.name हटवा; // मालमत्ता हटवा // पर्यायी // वापरकर्ता हटवा["नाव"]; console.log(user.name); // अपरिभाषित

हटवल्यानंतर, मालमत्ता अपरिभाषित असेल, म्हणून जेव्हा तुम्ही त्यात प्रवेश करण्याचा प्रयत्न करता तेव्हा, प्रोग्राम अपरिभाषित मूल्य परत करेल.