जावास्क्रिप्ट में डेटा मॉडल के साथ काम करना

नमस्ते, हब्रलुमि।

मेरे अनुभव और हमारी परियोजनाओं से छोटे से छोटा, जावास्क्रिप्ट में मॉडल के साथ काम करने के लिए एक छोटा पुस्तकालय पैदा हुआ था। इसे Model.js कहा जाता है।

मैं आपको इस पुस्तकालय के बारे में संक्षेप में बताऊंगा और इस पोस्ट में मैं उन लोगों से प्रतिक्रिया मांगता हूं, जो जटिल जावास्क्रिप्ट अनुप्रयोग बनाते समय, पहले से ही इस समस्या को एक निश्चित तरीके से हल किए बिना हल करते हैं। जो लोग सिर्फ अपनी जरूरतों के लिए सही उपकरण की तलाश कर रहे हैं, उनकी राय भी दिलचस्प है: आपको किस उपकरण की आवश्यकता है और Model.js आपको कितना सूट करता है ?

क्यों?

फ्रेमवर्क का उपयोग किए बिना, डेटा परत के साथ काम को सरल बनाने के लिए। लाइब्रेरी का वर्तमान पहला संस्करण - v0.1 12K के बारे में वजन - मुख्य रूप से डेटा सत्यापन और इवेंट प्रबंधन के साथ मदद करने के लिए डिज़ाइन किया गया है, विशेष रूप से घटनाओं के साथ जब डेटा बदलता है।

क्या है खास?

चीनी। आंख के लिए एक साधारण सुखदायक चीनी।

वर्णित मॉडल कहीं सरल नहीं है।

var Note = new Model('Note', function () { this.attr('id!', 'number'); this.attr('title', 'string', 'nonempty'); this.attr('text', 'string'); }); 

फिर हम हमेशा की तरह वस्तुओं को बनाते हैं।

 var note = new Note({ id: 123, title: "Hello World" }); 

सार्वजनिक इकाई गुण

गुण मान के प्राप्तकर्ता। हमारे उदाहरण में, यह है:

 note.data.id note.data.title note.data.text 

Setters। बदलते मूल्यों के अलावा, परिवर्तन घटना भी निकाल दी जाती है।

 note.data.id = note.data.title = note.data.text = note.data = {…} 

Getter note.get(attrName[, attrName, …]) किसी ऑब्जेक्ट को मांगी गई विशेषताओं के मानों के साथ लौटाएगा।

note.get() सभी डेटा की एक प्रति लौटाएगा।

note.data() के समान है।

note.set(attrName, value) और note.set({…}) परिवर्तन ईवेंट को "फायर" नहीं करते हैं।

note.hasChanged कहता है कि क्या इकाई डेटा तब से बदल गया है जब इसे अंतिम बार सहेजा गया था।

note.isNew कहना है कि क्या इकाई डेटा कम से कम एक बार सहेजा जाता है।

note.isPersisted कहना है कि क्या हालिया बदलाव सहेजे गए हैं।

note.bind(eventName, handler) "हैंग" करता है। वैसे, आप किसी भी ईवेंट के हैंडलर को न केवल एक अलग इकाई पर लटका सकते हैं, बल्कि कक्षा के सभी संस्थानों ( Note.bind ) पर भी लटका सकते हैं।

note.isValid वर्तमान मॉडल डेटा मान्य है या नहीं।

note.errors वास्तव में, यदि कोई है, तो डेटा त्रुटियों को लौटाता है।

note.revert() बिना सहेजे हुए परिवर्तनों को वापस note.revert() और revert ईवेंट को फायर करता है।

वह सब है।

आप पूछ सकते हैं कि भंडारण के तरीके और इतने पर और आगे कहां हैं? - मैं जवाब दूंगा: पुस्तकालय के उपयोग का अर्थ है कि डेवलपर को अपने आवेदन के तर्क द्वारा आवश्यक इन विधियों को स्वतंत्र रूप से लागू करना चाहिए।

यह ध्यान दिया जाना चाहिए कि बचत के साथ एक चेतावनी है: यदि डेटा सफलतापूर्वक सहेजा गया था, तो आपको निजी विधि note._persist() का उपयोग करके इकाई को सूचित करने की आवश्यकता है note._persist() , जो persist घटना भी आग लगाती है।

एक उदाहरण स्पष्टीकरण अच्छा है। मान लीजिए कि हमारा एप्लिकेशन ब्राउज़र वातावरण में चलता है और note.save() विधि को अजाक्स का उपयोग करके डेटा को सहेजना चाहिए।

 Note.prototype.save = function () { var note = this; return $.ajax({ type: 'PUT', url: '/notes/'+note.data.id, data: note.data(), dataType: 'json' }).done(function (json) { note._persist(); }); } note.bind('persist', function () { $('h1', 'div#note'+this.data.id).html(this.data.title); }); note.data = { id: 123, title: "abc", text: "" } if (note.hasChanged && note.isValid) { //  Django-style note.save(); } 

डेटा सत्यापन

मॉडल बनाते समय, इसके प्रत्येक गुण का वर्णन किया जाता है।

 this.attr('title', 'string', 'nonempty') 

सबसे पहले, विशेषता नाम का संकेत दें, फिर उसके सत्यापनकर्ता। सत्यापनकर्ता, जब समय आता है, घोषित क्रम में विशेषता मान की जाँच करेगा।

सामान्य तौर पर, सत्यापनकर्ता सामान्य कार्य हैं जो मान लेते हैं और जब ये मान अमान्य होते हैं तो त्रुटियों को वापस कर देते हैं।

 function validateMinLength(value, minLength) { if (value.length < minLength) return 'tooshort'; } 

यदि आपको सत्यापनकर्ता को कई बार उपयोग करने की आवश्यकता है, तो नाम से कनेक्ट करने के लिए इसे पंजीकृत करना उचित है।

 Model.registerValidator('array', function (value) { if (Object.prototype.toString.call(v) === '[object Array]') return 'wrongtype'; }); Model.registerValidator('minLength', validateMinLength); 

Model.js में कई बुनियादी (पहले से पंजीकृत) सत्यापनकर्ता हैं: number , string , boolean , nonnull , nonnull और। वे, हमारे उदाहरण की तरह, नाम से विशेषताओं से जुड़े हो सकते हैं।

विशेषता का वर्णन करते समय सत्यापनकर्ता को पैरामीटर पास करने के लिए, आपको इसे लिखने की आवश्यकता है, जैसा कि नीचे दिए गए उदाहरण में, सरणी के रूप में है:

 this.attr('title', 'string', 'nonempty', [ 'minLength', 6 ]); 

पंजीकरण के बिना वैध को सामान्य दादाजी पद्धति से जोड़ा जा सकता है।

 this.attr('title', 'string', 'nonempty', [ 'minLength', 6 ], function (title) { if (title[0] !== title[0].toUpperCase()) return 'downcase'; }); 

यह सब आवश्यक है ताकि note.isValid true या false कह सके, और note.errors किसी ऑब्जेक्ट को त्रुटियों के साथ वापस कर सकता है, यदि कोई हो।

 note.data = { id: 'abc', title: '', text: 3 }; //    note.isValid // false note.errors // { id: 'wrongtype', title: 'empty', text: 'wrongtype' } 

घटनाओं

चार घटनाएं हैं: initialize , change , persist और revert । जैसा कि ऊपर उल्लेख किया गया है, आप हैंडलर को एक विशिष्ट इकाई ( note.bind ) पर लटका सकते हैं, या आप इसे एक वर्ग ( Note.bind ) पर भी लटका सकते हैं, ताकि हैंडलर सभी संस्थाओं के लिए सामान्य हो जाए।

इकाई बनाते समय एक बार initialize "निकाल" दिया जाता है: var note = new Note({…}) । तो initialize हैंडलर को लटकाने के लिए केवल कक्षा पर ही समझ में आता है।

हर बार विशेषता मान परिवर्तन होने पर change निकाल दिया जाता है। हालांकि, ऐसे सेटर हैं जो बदलाव को नहीं खींचते हैं (यह ऊपर वर्णित किया गया था)।

perist - जब एक इकाई को एक संकेत मिलता है कि परिवर्तनों को सफलतापूर्वक सहेज लिया गया है।

revert - जब एप्लिकेशन लॉजिक ने अभी तक बिना सहेजे हुए बदलाव ( note.revert() विधि का उपयोग करके note.revert() को वापस रोल करने का आदेश दिया।

 var ALLOWED_LANGUAGES = ['en', 'ua', 'ru']; var Note = new Model('Note', function () { this.attr('id!', 'number'); this.attr('title', 'string', 'nonempty'); this.attr('lang', 'string', 'nonempty', [ 'in', ALLOWED_LANGUAGES]); this.attr('text', 'string'); }); Note.bind('initialize', function () { if (!this.data.lang) { this.set('lang', 'en'); // change   —   ! } }); note.bind('change', function (changes) { if (changes.title) $('h1', 'div#note'+this.data.id).html(changes.title); }); 

निष्कर्ष में

अब Model.js कला की एक शुद्ध स्थिति है , यह एक मध्यवर्ती है, लेकिन आत्मविश्वास से काम करने वाला परिणाम है। यदि आप पुस्तकालय में रुचि रखते हैं, यदि आपके पास इसका उपयोग करने की कोशिश करने की इच्छा है, तो मुझे आपके सवालों के जवाब देने में खुशी होगी। यह कैसे काम करता है इसके बारे में अधिक जानकारी जीथब पर और परीक्षणों में प्रलेखन में पाया जा सकता है।

इस बीच, बच्चे को एक अच्छी यात्रा की शुभकामनाएं, क्योंकि "वयस्क" पुस्तकालय बनने के लिए, उसे अभी भी बहुत काम करने की जरूरत है।