Vorteil der Verwendung von Methode in OOP Javascript

Question

stieß ich auf eine JS-Datei, die in einer fremden Art und Weise gebaut wurde:

var modal = (function(){ 
    var method = {}; 

    // Center the modal in the viewport 
    method.center = function() {}; 

    // Open the modal 
    method.open = function (settings) {}; 

    // Close the modal 
    method.close = function() {}; 

    return method; 
}()); 

verstehe ich das Teil eine Funktion in den „modal“ von Verpackungs Objekt, aber warum binden alle die Funktionen zu method und dann am Ende zurückgeben?

Answer 1

Dies ist ein Entwurfsmuster, um Funktionalitäten in Module zu gruppieren und globale Variablen loszuwerden. Dies führt zu besserem Code.

1. Der Funktionsaufruf erzeugt eine ‚Schließung‘ heißt ein Rahmen für alle Variablen in dieser Funktion erklärt, bleiben sie auch nach der Funktion verlassen hat, und sie sind außerhalb der Funktion nicht sichtbar.

    var modal = (function(){ 
        var method = {}; 
        // Center the modal in the viewport 
        method.center = function() {}; 
   
        // Open the modal 
        method.open = function (settings) {}; 
   
        // Close the modal 
        method.close = function() {}; 
   
        return method; 
       }()); // This function call here creates a "closure" (scope) 
   

2. Jetzt bestimmte Mitglieder des Moduls zur Verfügung außerhalb des Moduls zu machen, müssen sie von der Funktion zurückgegeben werden, hier return method tut genau das, method ein öffentliches Objekt des Moduls zu machen, die im Freien verwendet werden können .

3. Statt invididual Variablen wie open schaffen, close etc, werden die entsprechenden Funktionen als Eigenschaften (Schlüssel des Objekts) zugeordnet zu dem Haupt method Objekt, so dass das einzelne Objekt zurückzukehr macht die zugehörigen Funktionen zugänglich. Dies dient auch dazu, die Anzahl der Bezeichner (Namen) innerhalb des Closing Scopes zu reduzieren.

Lesen Sie diesen sehr guten Artikel zu diesem modular Muster:

http://www.yuiblog.com/blog/2007/06/12/module-pattern/

Answer 2

Für diesen speziellen Code, gibt es keinen Vorteil. Es macht das gleiche wie:

var modal = { 

    // Center the modal in the viewport 
    center: function() {}, 

    // Open the modal 
    open: function (settings) {}, 

    // Close the modal 
    close: function() {}, 

}; 

Wenn Sie jedoch eine lokale Variable in der Funktion, denn das ist eine andere Sache:

var modal = (function(){ 

    // a variable that is private to the object 
    var local = 'hello world'; 

    var method = {}; 

    // Center the modal in the viewport 
    method.center = function() {}; 

    // Open the modal 
    method.open = function (settings) {}; 

    // Close the modal 
    method.close = function() {}; 

    return method; 
}()); 

Nun sind alle Methoden im Objekt können die private Variable zuzugreifen, aber es ist nicht direkt von außerhalb des Objekts erreichbar.