सभी को नमस्कार! मैं घोषित सदस्यता और ईवेंट हैंडलिंग के लिए कॉफीस्क्रिप्ट के अपने टुकड़े को दिखाना चाहता हूं।
प्रागितिहास
मेरे पास 5 साल का इंजीनियरिंग का अनुभव है, जिसमें .NET (+ फॉर्म, + WPF, + .NET MVC), जावा (+ स्विंग, + टेपेस्ट्री 5, + ग्रूवी), जावास्क्रिप्ट (+ कॉफीस्क्रिप्ट, + नोड) शामिल हैं।
पिछले साल मैं सक्रिय रूप से अपना सिंगल-पेज वेब एप्लिकेशन लिख रहा हूं जो बिना रीबूट के काम करता है (जिसकी चर्चा भविष्य में रिलीज होगी)। उपयोगकर्ता इंटरफ़ेस का संपूर्ण गतिशील भाग क्लाइंट पर बनाया गया है, केवल सर्वर से डेटा आता है। जैसा कि अक्सर यूआई में होता है, मैं घटक पेड़ से निपटता हूं। बेशक, पेड़ की बातचीत को व्यवस्थित करने के लिए, मुझे घटनाओं को भेजने और प्रसंस्करण के लिए एक तंत्र की आवश्यकता है। मैंने अपना खुद का लिखने का फैसला किया, और बैकबोन का उपयोग नहीं किया, या Google बंद से कुछ। किसी भी मामले में, मुझे श्रोता पैटर्न को लागू करने का अनुभव था।
यदि आप इसे सुनना चाहते थे, तो पहले संस्करण की घटनाओं का क्लास एमिटर - बस आपको श्रोताओं के एक समूह में लिखा था। जब "एच" घटना हुई, तो वह सरणी के चारों ओर चला गया, और "ऑन" विधि के साथ श्रोताओं की तलाश की, और इसे बुलाया। Swing / .NET में टाइप करें।
कम संख्या में एमिटर के लिए सब कुछ ठीक रहा। सिस्टम की वृद्धि के साथ, विभिन्न उत्सर्जकों के बीच घटना के नामों को ओवरलैप करने की समस्या आई। सब्सक्राइबर ने एक ही "एचएफ" विधि का प्रदर्शन किया, भले ही "एच" अलग-अलग एमिटर से आया हो। तब यह JS, EventEmitter से अधिक परिचित था, जैसा कि jQuery / NodeJS में। मैं विशेष रूप से देरी नहीं करूंगा ...
SuperEmitter
अब मैं पेड़ के एक सारणीबद्ध प्रतिनिधित्व के साथ "emitter -> घटनाओं -> प्रतिक्रियाओं" पर काम कर रहा हूं। एक उदाहरण:
class Brain extends SuperEmitter event_table: [ # [ 'ear' , [ [ 'snake_heard' , [ 'emit_adrenaline' 'look_around' ] ] ] ] [ 'eye' , [ [ 'food_spotted' , [ 'emit_noradrenaline' 'hunt' 'emit_endorphins' ] ] [ 'predator_spotted', [ 'emit_cortisol' 'emit_adrenaline' 'run' ] ] ] ] [ 'nose', [ [ 'food_smelled' , [ 'look_around' ] ] [ 'blood_smelled' , [ 'emit_adrenaline' 'look_around' ] ] ] ] ] # constructor and instance members constructor = -> @ear = new Ear() @eye = new Eye() @nose = new Nose() # methods: emit_adrenaline: -> emit_cortisol: -> emit_endorphins: -> hunt: -> look_around: -> new Brain().bind_events()
बजाय:
class Brain bind_events: -> @ear.on 'snake_heard', (args...) => # @emit_adrenaline(args...) # @look_around(args...) @eye.on 'food_spotted', (args...) => @emit_noradrenaline(args...) @hunt(args...) @emit_endorphins(args...) @eye.on 'predator_spotted', (args...) => @emit_cortisol(args...) @emit_adrenaline(args...) @run(args...) @nose.on 'food_smelled', (args...) => @look_around(args...) @nose.on 'blood_smelled', (args...) => @emit_adrenaline(args...) @look_around(args...) # ..
यह मेरा
ognivo / सुपर-एमिटर लाइब्रेरी है । यह आपको सभी कनेक्टिंग कोड को हटाने, और स्रोतों, घटनाओं और प्रतिक्रियाओं पर ध्यान केंद्रित करने की अनुमति देता है। कोड कम है, यह क्लीनर है, अधिक दानेदार है। प्रारूप आपको यह देखने की अनुमति देता है कि प्रतिक्रिया क्रम क्या और कहाँ से आता है।
इसके अलावा, एक तालिका डेटा है, और इसके साथ आप वह सब कुछ कर सकते हैं जो आप डेटा के साथ कर सकते हैं। तुलना, गोंद, क्लोन और इतने पर।
डेमो
ऑनलाइन डेमो करें । यह रेपो में डेमो फोल्डर से है। आप रेपो को क्लोन कर सकते हैं, आप निष्पादित कर सकते हैं
npm install super-emitter
। मैं एक बड़ा डेमो बनाना चाहता हूं, लेकिन अब समय के साथ यह बहुत तंग है।
घटनाओं का मुद्दा और स्वागत
SuperEmitter को एक वर्ग के रूप में लागू किया जाता है। इसकी एक उत्सर्जन विधि है जिसके माध्यम से एक घटना जारी की जाती है और इसके तर्क पारित किए जाते हैं। तर्क को एक सरणी में पैक किया जाना चाहिए जब कहा जाता है, जो उन्हें नेत्रहीन बाहर खड़ा करता है। एक ईवेंट-सब्सक्राइब फ़ंक्शन एक नियमित पैरामीटर सूची के माध्यम से तर्कों को स्वीकार करता है।
brain = new Brain() brain.bind_events() brain.emit('adrenaline') brain.emit('adrenaline', [dosage_ml = 300, noradrenaline = true]) brain.on 'adrenaline', (dosage_ml, noradrenaline) -> console.log "I'm running from something"
आवश्यकताओं
जिस उदाहरण के लिए आप सदस्यता ले रहे हैं, उसके पास हस्ताक्षर के साथ "ऑन" विधि होनी चाहिए (क्या रूसी शब्द है?) Event_name, कॉलबैक। उपयुक्त jQuery के रैपर, काइनेटिक जेएस आकार, सुपरमिटेर वर्ग के आकार।
AddEventListener विधि, DOM घटकों के लिए मानक, एक ही हस्ताक्षर है, इसलिए इसके साथ कुछ भी जटिल नहीं है। एक बार मुझे खिड़की से पॉपस्टैट की सदस्यता लेने की आवश्यकता थी, इसलिए सब कुछ तय किया गया था window.on = window.addEventListener।
क्या नहीं
घटनाओं की कोई चढ़ाई और अवरोधन नहीं है। मैं ऐसा करने के कारणों को नहीं देखता, मुझे यह पसंद है कि घटक के पदानुक्रम के प्रत्येक स्तर के लिए मैं उन सभी घटनाओं को देखता हूं जो इसके माध्यम से गुजरती हैं।
मुझे आलोचना, प्रशंसा और परिवर्धन की खुशी होगी।
ZY: मैंने जानबूझकर शब्द emitter चुना, स्रोत नहीं।