14
14

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Essential JavaScript Design Patterns For Beginners (作者:Addy Osmani)

Last updated at Posted at 2012-12-26

#JavaScriptデザインパターン:The Module Pattern
###JavaScriptの勉強にすごく役に立つので、JavaScriptを勉強したい人にはお勧めです。
####※The Module Patternサンプルソース

var nameSpace = nameSpace || {};
var nameSpace.someModule = nameSpace.someModule || (function(){

  // private attributes
  var privateVar = 5;

  // private methods
  var privateMethod = function(){
     return 'Private Test';
  };

  return {
    // public attributes
    publicVar: 10,
    // public methods
    publicMethod: function(){
      return ' Followed By Public Test ';
    },

    // let's access the private members
    getData: function(){
      return privateMethod() + this.publicMethod() + privateVar;
    }
  }
})(); //the parens here cause the anonymous function to execute and return
nameSpace.someModule.getData();

####※The Revealing Module Patternサンプルソース

 var nameSpace = nameSpace || {};
 var nameSpace.myRevealingModule = nameSpace.myRevealingModule || (function(){

    var name = 'John Smith';
    var age = 40;

    function updatePerson(){
      name = 'John Smith Updated';
    }
    function setPerson () {
       name = 'John Smith Set';
    }
    function getPerson () {
       return name;
    }
    return {
        set: setPerson,
        get: getPerson
    };
}());

// Sample usage:
nameSpace.myRevealingModule.get();

###勉強・分析・まとめ:
クロージャ即時関数の概念及びThe Singleton Patternを理解したら、The Module Patternも理解しやすくなりますね。Functionの中にFunction及び変数を定義することにより、Javaのprivateを真似できます。Functionの中のFunction(内部Function)がその外側のFunction(外部Function)の中に定義しているFunctionを参照できることを利用して、外部に公開したいFunctionをオブジェクトの中に入れて、Returnしたら、外部に公開できるようになります。The Revealing Module PatternはJavaのクラスの定義にちょっと似ていますね。

上記2つのサンプルソースを見比べたら、やはり下のThe Revealing Module Patternサンプルソースはお勧めです。なぜならば、The Module PatternサンプルソースではpublicVarをそのまま外部に公開したので、モジュールを使用した外部のソースではnameSpace.someModule.publicVar = "value";の形で値を設定したり、var param = nameSpace.someModule.publicVar;で値を取得したりすることになります。これだと後日publicVarの変数名をpublicVar2に変更したら、外部でそのモジュールを使用するソースも修正しなくてはいけなくなります。これは好ましくないことです、それでThe Revealing Module Patternサンプルソースのようにフィールドから値を取り出して返すメソッドGetter(ゲッター)とフィールドに値を入れるメソッド「Setter」(セッター)を通して外部に公開することでこの問題を解決できます。

14
14
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
14
14

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?