विभिन्न एमडी मॉड्यूल में संसाधन साझा करें

Question

मैं वर्तमान में एक नया वेब एप्लिकेशन विकसित कर रहा हूं।

यह पहली बार है जब मैं एएमडी मॉड्यूल के साथ requjs का उपयोग कर रहा हूं।

उस नए प्रतिमान में उपयोग करना इतना आसान नहीं है - जैसा कि मैं समझता हूं - वैश्विक नामस्थान में कोई चर नहीं।

पिछले वेब अनुप्रयोगों में मेरे पास हमेशा वैश्विक नामस्थान में एक चर होता था जिसे मैं विभिन्न मॉड्यूल में कई संसाधनों को साझा करने के लिए उपयोग कर सकता था।

अब requjs एएमडी मॉड्यूल के साथ, मैं backbone.js और jquery (दोनों amd संस्करण - jquery 1.7.1 और backbone.js 0.5.3-optamd3) का उपयोग करता हूं।

कहीं मेरे आवेदन में मैं सर्वर (उपयोगकर्ता ऑब्जेक्ट) से backbone.js मॉड्यूल लाता हूं। मैं अलग-अलग एएमडी मॉड्यूल से इस मॉड्यूल तक पहुंच प्राप्त करना चाहता हूं। मैं भी एक आवेदन व्यापक घटना वस्तु चाहते हैं।

क्या आप मुझे बता सकते हैं: विभिन्न मॉड्यूल में संसाधनों को साझा करने के लिए एएमडी की आवश्यकता में क्या सही तरीका है?

Answer 1

मैं अपने आप को एक समाधान मिल गया।

आपके उत्तर के लिए धन्यवाद, IntoTheVoid, लेकिन मैं एएमडी जैसे समाधान की उम्मीद कर रहा था। इसका मतलब है, फिर से, वैश्विक नामस्थान "प्रदूषण" नहीं।

Addy उस्मानी से "https://github.com/addyosmani/backbone-aura" और "https://github.com/amdjs/amdjs-api/wiki/AMD" द अतुल्यकालिक मॉड्यूल परिभाषा (एएमडी) एपीआई विनिर्देश:

मेरे समाधान के लिए 2 कुंजी थे।

स्पेक कहता है: "यदि कारखाना एक कार्य है तो इसे केवल एक बार निष्पादित किया जाना चाहिए।"

तो, अगर एक AMD मॉड्यूल एक वेब अनुप्रयोग में एक निर्भरता के रूप में कई बार निर्दिष्ट किया जाता है, निर्भरता न केवल लोड नहीं कई बार, यह भी कई बार निष्पादित नहीं है, और इस नए बात है मेरे लिए। इसे केवल एक बार निष्पादित किया जाता है और फैक्ट्री फ़ंक्शन का वापसी मूल्य रखा जाता है। एक ही पथ के साथ प्रत्येक निर्भरता एक ही वस्तु है। और यह सब कुछ बदलता है।

define([], function() { 
    var app_registry = {}; 
    app_registry.global_event_obj = _.extend({}, Backbone.Events); 
    app_registry.models = {}; 
    return app_registry; 
}); 

अब, उन मॉड्यूल जहां संसाधनों को साझा करना चाहते हैं, तो आप निर्भरता के रूप में इस app_registry मॉड्यूल घोषित करने और एक में लिखें::

तो, आप बस निम्नलिखित AMD मॉड्यूल को परिभाषित

define(['jquery','underscore','backbone','app_registry'], 
    function ($, _, Backbone, app_registry){ 
    var firstView = Backbone.View.extend({ 
    initialize: function() { 
     _.bindAll (this, 'methodOne'); 
     this.model.bind ('change', this.methodOne); 
     this.model.fetch(); 
    }, 
    methodOne: function() { 
     app_registry.models.abc = this.model; 
    } 
    ... 

और अन्य में:

define(['jquery','underscore','backbone','app_registry'], 
    function ($, _, Backbone, app_registry){ 
    var secondView = Backbone.View.extend({ 
    initialize: function() { 
     _.bindAll (this, 'methodTwo'); 
     app_registry.global_event_obj.bind ('special', this.methodTwo); 
    }, 
    methodTwo: function() { 
     app_registry. ... 
    } 
    ... 

Answer 2

आप अपने एंट्री पॉइंट एएमडी मॉड्यूल में एक वैश्विक APP परिभाषित कर सकते हैं। APP अन्य साझा मॉड्यूल के लिए बना सकते हैं और पकड़ के लिए एक संदर्भ:

APP = { 
    this.settings : function() { 
     if(settingsModule == undefined){ 
      //require, create and return it 
     } else { 
      return settingsModule; 
     } 
    } 
} 

Answer 3

के रूप में अपने प्रश्न का उत्तर कैसे जनसंपर्क करने के लिए करने के लिए एक एप्लिकेशन वाइड इवेंट ऑब्जेक्ट को ओवाइड करें, आप ग्लोबल कॉन्टेक्स्ट नामक एक एएमडी मॉड्यूल बना सकते हैं और इसे main.js. में तत्काल बना सकते हैं।
इसके बाद आप globalContext करने के लिए सेटिंग्स देते हैं और उप-घटक आदि

//main.js file 
    require([ "./global-context" ], function(GlobalContext) { 
      new GlobalContext(); 
    }); 

वैश्विक-context.js फ़ाइल हम तो ऐसे लोड हो रहा है बच्चे के मॉड्यूल के रूप में कार्य कर सकते हैं बनाने के लिए वैश्विक संदर्भ का उपयोग कर सकते

define(["Boiler", "./settings", "./modules/modules"], 
      function (Boiler, settings, modules) { 
        var GlobalContext = function() { 

       //here we use a template javascript class called Boiler.Context 
       var globalContext = new Boiler.Context("GlobalModule"); 

       //add settings to the context which can be obtained globally throughout     the application 
       globalContext.addSettings(settings); 

       //here we load the sub modules of the global context 
       globalContext.loadChildModules(modules); 
}; 

यह हमने BoilerplateJS में लागू किया है, जो बड़े पैमाने पर जावास्क्रिप्ट उत्पाद विकास के लिए संदर्भ आर्किटेक्चर है।

Answer 4

आप किसी आवश्यकता वाले मॉड्यूल (उर्फ 'निर्भरता इंजेक्शन') में किसी भी मूल्य को इंजेक्ट करने के लिए प्रारंभिक पैटर्न का उपयोग कर सकते हैं।

एक अपने कोड में कहीं भी कॉल की आवश्यकता है:

var MyBackboneModule; 

MyBackboneModule = someWayToGetAReferenceToIt(); 

require("module", function(Module) { 
    Module.initialize(MyBackboneModule); 
}); 

module.js फ़ाइल के साथ के रूप में

define([], function(){ 
    var BackboneModuleDoingThisAndThat; 

    function initialize(pBackboneModule) { 
     BackboneModuleDoingThisAndThat = pBackboneModule ; 
    }; 

    function doSomething() { 
     var x = BackboneModuleDoingThisAndThat.computeThis(42); 
    }; 


    return { 
     initialize: initialize 
    }; 
}); 

Answer 5

बस अपने खुद के जवाब पर एक टिप्पणी में परिभाषित किया - आप एक को परिभाषित करने की जरूरत नहीं है आपके app_registry मॉड्यूल में फ़ंक्शन:

define({ 
    global_event_obj: _.extend({}, Backbone.Events); 
    models: {} 
}); 

पर्याप्त होना चाहिए।

देखें: the docs

हालांकि इन बातों से सावधान रहें। ऐसे उपयोगकेस हैं जहां साझा डेटा मॉड्यूल समझ में आता है। लेकिन यदि आप इसे छद्म वैश्विक नामस्थान के रूप में उपयोग करते हैं, तो यह केवल ग्लोबल्स का उपयोग करने से बेहतर नहीं है (यह नहीं कह रहा कि आप क्या कर रहे हैं)।