JavaScript デザイン パターン: モジュール パターンと公開モジュール パターンの違いは? 質問する

モジュール パターンを実装する方法は少なくとも 3 つありますが、Revealing Module Pattern は正式な名前を持つ唯一のモジュール パターンの派生です。

基本的なモジュールパターン

モジュール パターンは、次の条件を満たす必要があります。

• プライベートメンバーは閉鎖中に住んでいます。
• パブリック メンバーは戻りオブジェクトで公開されます。

しかし、この定義には多くの曖昧さがあります。この曖昧さを別の方法で解決すると、モジュール パターンのバリエーションが得られます。

モジュールパターンの公開

公開モジュールパターンは、モジュールパターンのバリエーションの中で最も有名で人気があります。他の選択肢に比べて、次のような多くの利点があります。

• 関数本体を変更せずにパブリック関数の名前を変更します。
• 関数本体を変更せずに、1 行を変更するだけで、メンバーをパブリックからプライベートに、またはその逆に変更できます。

RMP は、元の条件に加えて、次の 3 つの追加条件を満たしています。

• パブリックかプライベートかに関係なく、すべてのメンバーはクロージャ内で定義されます。
• 戻りオブジェクトは関数定義のないオブジェクトリテラルです。右辺の式はすべてクロージャ変数です。
• すべての参照は、戻りオブジェクトではなく、クロージャ変数を介して行われます。

次の例は、それがどのように使用されるかを示しています。

var welcomeModule = (function(){
  var name = "John";
  var hello = function(){ console.log("Hello, " + name + "!");}
  var welcome = function() { console.log( hello() + " Welcome to StackOverflow!");}
  return {
    name: name,
    sayHello: hello,
    sayWelcome: welcome
  }
})();

var welcomeModule = (function(){
  var name = "John";
  var hello = function(){ console.log("Hello, " + name + "!");}
  var welcome = function() { console.log( hello() + " Welcome to StackOverflow!");}
  return {
    //name: name,
    //sayHello: hello,
    sayWelcome: welcome
  }
})();

var welcomeModule = (function(){
  return {
    name: "John",
    sayHello: function(){ console.log("Hello, " + this.name + "!");}
    sayWelcome: function() { console.log( this.hello() + " Welcome to StackOverflow!");}
  }
})();

var welcomeModule = (function(){
  var name = "John";
  var sayHello = function(){ console.log("Hello, " + name + "!");};
  return {
    //name: "John",
    //sayHello: function(){ console.log("Hello, " + this.name + "!");}
    sayWelcome: function() { console.log( hello() + " Welcome to StackOverflow!");}
  }
})();

var welcomeModule = (function(){
  var stub = {};
  stub.name = "John";
  stub.sayHello = function(){ console.log("Hello, " + stub.name + "!");}
  stub.sayWelcome = function() { console.log( stub.hello() + " Welcome to StackOverflow!");}
  return stub;
})();

var welcomeModule = (function(){
  var stub = {};
  var name = "John";
  var sayHello = function(){ console.log("Hello, " + name + "!");}
  
  stub.sayWelcome = function() { console.log( hello() + " Welcome to StackOverflow!");}
  return stub;
})();