Javascript abonnieren Funktion nach Instanciation Rückruf

Question

Ich habe ein JavaScript-Objekt auf diese Weise hergestellt:

function App(callback){ 

// Call some "long running functions meant for initialization 
callback(this); 

} 

In meinem Haupt-Template-Seite (_Layout.cshtml auf ASP MVC) Ich instanziieren es wie folgt aus:

_Layout.cshtml

var oApp = new App(function(initializedApp){ 

    // Instanciate here other Javascript components that depend on 
    // App initialization 
    var oComponent1 = new Component1(initializedApp); 
}); 

Dies funktioniert gut! Component1 wird initialisiert, nachdem die App die Initialisierung abgeschlossen hat und alles in Ordnung ist.

Problem steigt in Page1.cshtml (das innerhalb _Layout.cshtml gerendert wird und Zugriff auf oApp hat). Page1 muss auch seine eigene Komponente initialisieren, die App vollständig initialisiert werden muss.

Page1.cshtml

// How do I "subscribe to the App callback function so that Compnent2, s 
// specific to the Page1.cstml, is initialized afetr App has finished 
// its initialization ??? 
var oComponent2 = new Compnent2(oApp); 

oApp.callback(); // ??? 
oApp(function(initializedApp){ // code here... }); //??? 

Dank

Lorenzo

Answer 1

Ihr Lauf mit einem interessanten Muster. Ich würde vorschlagen, eine unaufdringlichere Art des Initialisierens und des Anrufens von Javascript zu verwenden. Ich würde sagen, dass die meisten JS-Aufrufe in CSHTML als Code-Geruch betrachtet werden können.

Wie auch immer, ich werde Ihre Frage beantworten. Ich würde App ändern, um die Fähigkeit zu haben, um Rückrufe zu registrieren:

function App(callbacks) 
{ 
    var self = this; 
    self.callbacks = []; 
    self.addCallbacks = function(newCallbacks) 
    { 
     //allow either a single callback or an array of callbacks 
     if(isFunction(callbacks) 
     { 
      self.callbacks.push(newCallbacks); //single callback 
     } 
     else 
     { 
      for(var i = 0; i < newCallbacks.length; i++) 
      { 
       //theoretically, you can have multi-dimensional arrays of callbacks, but that's just excessive 
       self.addCallbacks(newCallbacks[i]); 
      } 
     } 
    }; 
    self.addCallbacks(callbacks); 

    //some point later, call all the callbacks: 
    for(var i = 0; i < self.callbacks.length; i++) 
    { 
     self.callbacks[i](this); 
    } 
} 

Dann in Ihrem Page1.cshtml:

var oComponent2 = new Compnent2(oApp); 
var mycallback = function(initializedApp){ // code here... }; 
oApp.addCallbacks(mycallback); 

//or, if you have many callbacks to register: 
var mycallbacks = [ 
    function(initializedApp){ // code here... }, 
    function(initializedApp){ // code here... } 
]; 
oApp.addCallbacks(mycallbacks); 

isFunction von here entlehnt:

var isFunction = function(functionToCheck) 
{ 
    var getType = {}; 
    return functionToCheck && getType.toString.call(functionToCheck) === '[object Function]'; 
}