Verwendung des Revealing-Modulmusters in JavaScript

Question 1

Ich bin über diesen Beitrag gestolpert: JavaScript's Revealing Module Pattern . Ich möchte dies in meinem Projekt verwenden.

Stellen wir uns vor, ich habe eine Funktion abcund rufe diese Funktion in meiner Haupt-JavaScript-Datei auf.

Macht dieses Muster die Dinge anders? Kann mir jemand ein grundlegendes Beispiel für dieses Muster zeigen?

Question 2

Ein kleines Beispiel:

var revealed = function(){
   var a = [1,2,3];
   function abc(){
     return (a[0]*a[1])+a[2];
   }

   return {
      name: 'revealed',
      abcfn: abc
   }
}();

in der anonymen Funktion, die initiiert wird, um revealedeinen Wert anzugeben, aund abcfür diese Funktion privat sind. Was die Funktion zurückgibt, ist ein Objektliteral mit einer nameEigenschaft und einer abcfnEigenschaft, die auf die verweist abc function. Der abc functionverwendet die private Variable a. Dies kann alles dank der Verwendung von Verschlüssen geschehen (alles im Bereich einer Funktion kann von allem anderen in derselben Funktion referenziert werden).

Offenbarte Verwendung:

alert(revealed.name);    //=> 'revealed'
alert(revealed.abcfn()); //=> 5 (1*2+3)

Question 3

DC = Douglas Crockford
RMP = Aufdeckendes Modulmuster

Der Unterschied zwischen DC und RMP ist hauptsächlich organisatorisch / lesbar

Beispiel wird im Artikel selbst vorgestellt? Und was genau fragst du, weil diese Dinge nichts mit Dateien zu tun haben, sondern mit Schließungen.

Sie setzen alles in einen Verschluss (Funktion) und legen nur den Teil frei, auf den Sie zugreifen möchten. Der Unterschied zwischen DC Stil und RMP ist , dass in den ersten Funktionen an verschiedenen Orten definiert werden , während in dem RMP sie immer an der gleichen Stelle definiert und dann später offenbarte in der Öffentlichkeit Objektliteral.

In DC und RMP haben Sie also:

Schließung, die es ermöglicht, private Teile (Variablen und Funktionen) zu definieren
privater Teil
öffentliches Ergebnis, das öffentlich sichtbare Funktionen und Variablen definiert (Status)

Diese beiden Muster unterscheiden sich nur in der Lesbarkeit. Im DC-Fall können Sie nicht immer wissen, wo bestimmte Funktionen definiert werden, aber im RMP wissen Sie immer, dass sich alles im privaten Teil befindet.

Question 4

Das Aufdecken von Modulmustern wird im Artikel Essential JavaScript Design Patterns For Beginners ziemlich gut beschrieben .

Question 5

Die vom Autor als "Douglas Crockfords Muster zum Erstellen von Objekten" bezeichnete Methode ist eigentlich das Modulmuster, das hauptsächlich von Richard Cornford et al . Siehe http://groups.google.com/group/comp.lang.javascript/msg/9f58bd11bd67d937

Zum Beispiel gibt es viele. Lesen Sie den folgenden Artikel und folgen Sie einigen der Links: http://peter.michaux.ca/articles/module-pattern-provides-no-privacy-at-least-not-in-javascript-tm

Question 6

Ich verwende gerne eine Mischung aus dem aufschlussreichen Modulmuster und dem Singleton-Muster, damit ich strukturierten Code mit den Vorteilen des Modulmusters beibehalten kann:

var MyFunction = function(){

    var _ = {
       Init: function(){
          _.Config.foo = "hello world";
       },
       Config:{
          foo:null
       },
       ShowAlert:function(){
          alert(_.Config.foo);
       }
    }

    return {
        Init: _.Init,
        ShowAlert: _.ShowAlert
    };
}();

MyFunction.Init();
MyFunction.ShowAlert();

Ich habe weitere Informationen dazu in meinem Blog geschrieben:

http://curtistimson.co.uk/js/mixing-revealing-module-and-singleton-javascript-patterns/

Question 7

Ich möchte nur hinzufügen: Mit diesem Muster ist es gut, globale Abhängigkeiten als Argumente / Parameter zu übergeben, damit sie explizit sind. Sie müssen es nicht tun, aber dies macht auf den ersten Blick deutlich, was Ihr Modul benötigt. Z.B:

var myModule = (function ($, loadModule) {
  "use strict";
})(jQuery, load);

In diesem Beispiel sehen Sie sofort in der ersten Zeile, dass Ihr Modul jQuery und ein anderes Modul verwendet, das für das Laden der Funktionalität verantwortlich ist.

Question 8

Für den Code außerhalb des Moduls macht es wenig Unterschied. In allen drei Fällen in diesem Artikel werden die Methoden auf dieselbe Weise aufgerufen. Die Struktur des Moduls selbst ist jedoch intern unterschiedlich.

Crockfords Modulmuster und das, was sie als "aufschlussreiches Modulmuster" bezeichnen, sind strukturell ziemlich dasselbe. Der einzige Unterschied besteht darin, dass sie die Methode zuerst einer lokalen Variablen zuweisen, um besser lesbar zu sein. Aber es gibt wirklich nichts Besonderes, und Sie haben einige Beispiele genau dort in Ihrem Link.

Question 9

Das Grundkonzept eines Revealing Modul ist , dass Sie eine haben , Objectdie kapselt seine Daten und Verhalten:

var Module = (function(){
    var privateStuff = {};
    var publicStuff = {};

    return publicStuff;
})();

Es gibt jedoch einige bewährte Methoden, die Sie bei der Verwendung dieses Musters anwenden sollten. Hier ist ein Modul (" Modulus") mit einigen Eigenschaften zur Demonstration, das einige dieser Praktiken verwendet:

function AbstractSomeClass(id) {
    this.id = id;
    return this;
}

var Modulus = (new (function SomeClass() {
    var thus = this;

    function NameClass(name){
        this.value = thus.name || name;
    }

    AbstractSomeClass.call(this, 998);

    this.name = 'Touring';
    this.name = ( new NameClass('Hofstadter') ).value;

    return {
        id: this.id,
        name: this.name
    };
})());

Beachten Sie die (new (function SomeClass(){ ... })());Syntax. Wenn newSie so verwenden, können Sie das thisSchlüsselwort innerhalb des Abschlusses verwenden. Dies ist praktisch , wenn Sie zu vererben Eigenschaften von einer anderen Klasse benötigen ( AbstractSomeClass.call(this, 998);) - Allerdings werden Sie noch brauchen , zeigen die Eigenschaften, die Öffentlichkeit haben möchten, zum Beispiel:

return {
    id: this.id,
    name: this.name
};

Beachten Sie auch , dass wir zuweisen thiszu thus- was erlaubt uns , die Parent- zu verwenden thisinnerhalb einer Unterklasse, die ihren eigenen hat thisUmfang ( this.value = thus.name || name;)

Dies sind wiederum nur einige der vorgeschlagenen Konventionen und Best Practices.

Question 10

Hier ist das kleine Beispiel für das Aufdecken des Modulmusters.

Es bietet die Möglichkeit, private und öffentliche Funktionen wie eine Klasse zu deklarieren. Dies ist der Hauptvorteil dieses Musters. Wenn wir einige der Funktionen, auf die global zugegriffen werden soll, nicht verfügbar machen möchten, werden sie privat und der Rest öffentlich gemacht ist das Beispiel, wie private und öffentliche Funktionen erstellt werden. Und noch etwas: Es ist ein selbst ausführbarer Codeblock.

  var Calculator = (function () {

        var num1 = 10;
        var num2=5
        var _abc = function () {
            return num1 - num2;
        };

        var _mulFunc = function () {
            return num1 * num2;
        };

        var _divFunc = function () {
            return num1/num2;
        };

        return {
           //public scope
            abc: _abc,
            mulFunc:_mulFunc
         };

    })();

alert (Calculator.abc ()); es gibt 5 zurück

alert (Calculator.mulFunc ()); es gibt 50 zurück

Auf __divFunc () kann nicht zugegriffen werden, da es sich um einen privaten Bereich handelt. Wir können nur auf die Funktionen zugreifen, die im Rückgabeobjekt deklariert sind , da es sich um eine öffentliche Funktionsdarstellung handelt

Question 11

https://www.realmelon.com/revealing-module-design-pattern-in-javaScript/

Ich habe einen Artikel darüber geschrieben.

Sie können sich das ansehen