2016-07-25 15 views
0

Ich benutze jQuery für einige Zeit, aber das ist in der Regel sehr einfach jQuery. Ich habe gerade ein Video-Tutorial angeschaut, in dem der Autor etwas namens Pub Sub Pattern verwendet. Ich habe noch nie davon gehört, so habe ich auf Stackoverflow für Erklärungen und Google gesucht:Verständnis von jQuery & Pub Sub-Muster mit diesem Beispiel

Aber es ist noch nicht klar für mich, vor allem wegen des Codes, ist verwendet vom Autor des oben genannten Tutorials. So werde ich diesen Code hier einfügen und wenn Sie mir Erklärungen geben kann:

1. Hier ist die erste Js Datei mit dem Namen pubsub.js, und ich verstehe es nicht:

(function($) { 

     var o = $({}); // ??? what is this ??? 

     $.subscribe = function() { // ??? and this ??? 
      o.on.apply(o, arguments); // ??? o.on.apply(o, arguments) ??? 
     }; 

     $.unsubscribe = function() { // ??? and this ??? 
      o.off.apply(o, arguments); // ?? 
     }; 

     $.publish = function() { // ??? and this ??? 
      o.trigger.apply(o, arguments); // ?? o.trigger.apply(o, arguments); ?? 
     }; 

    }(jQuery)); 

ich weiß, dass mit jQuery Sie $(document).ready() oder $(function() verwenden können, aber ich habe nie (function($) { ... }(jQuery)); gesehen - was heißt das/tun? Auch verstehe ich nicht den Rest des Codes ...

2. Die nächste Datei ist app.js und es enthält:

(function() { 
    $.subscribe('form.submitted', function() { 
     $('.flash').fadeIn(500).delay(1000).fadeOut(500); 
    }) 
}); 

Was bedeutet das eigentlich? Was wiederum bedeutet (function() { ... });? Und wie für den Rest des Codes, können Sie mir $.subscribe('form.submitted', function() { erklären?

3. Schließlich haben wir etwas wie folgt aus:

$.publish('form.submitted', form); // publish? 

Dies auch mir nicht klar ist.


Ich verstehe, dass all dies ist eine grundlegende Implementierung von PubSub Muster mit jQuery, aber ich immer noch nicht, warum jemand auf diese Weise tun würde (durch dieses Muster verwendet wird), ich habe that answer on Stackoverflow lesen, aber es ist für mich immer noch unklar ... Ich denke, wenn ich diesen Code verstehe, dann würde es mir klarer werden, warum und wann ich dieses Muster verwende.

+1

kurze Antwort ist wie benutzerdefinierte Ereignisse an ein Objekt gebunden denken. Siehe auch [Was ist das Konstrukt (function() {})()] (http://stackoverflow.com/questions/8228281/what-is-the-function-construct-in-javascript) – charlietfl

Antwort

1

Im Fall von (function($) { ... }(jQuery)); übergibt der Autor die jQuery-Instanz als Parameter. Innerhalb der Funktion (die ihren eigenen Gültigkeitsbereich hat) ist $ ein Verweis auf die übergebene jQuery-Instanz.

"Pub Sub" ist nur ein anderer Begriff für Event Management oder Event Handling. Alles was du sagst ist "Wenn [das] passiert, mach [das]".

Wenn Sie "abonnieren", geben Sie zwei Parameter ein, das "Ereignis", auf das Sie achten, und den Code, der ausgeführt werden soll, wenn das Ereignis ausgelöst wird.

Wenn Sie "publizieren", "feuern" Sie (oder triggern) dieses Ereignis aus.

Denken Sie daran wie das Onclick-Ereignis. Wenn Sie beim onclick-Ereignis etwas einrichten, abonnieren Sie dieses Ereignis. Wenn Sie auf klicken, veröffentlichen Sie dieses Ereignis.