2

私はjavascriptモジュールパターンを使用していますが、これまでのところ次のようになっています。

var APP;
if(APP == undefined) {
  APP = {};
}

APP = (function() {
    var userId = -1;
    var privateVar = '';

    var _init = function($userId) {
       userId = $userId;
    };
    var _publicMethod = function($id){
        privateVar = id;
    };
    return {
        init = function($userId) {
             _init($userId);
         },
        publicMethod = function($id) {
           _publicMethod($id);
        }
    };
})();

次に、一般的なutilsモジュールがあります。

APP.utils = (function(){

})();

そして、ページごとにモジュールを作成することを計画しているので、これらのDOM要素がイベントが存在しないページでは、理由もなくイベント（ボタンのクリックなど）をワイヤアップしません。

APP.homePage = (function(){
     return {

     };
})();

したがって、各モジュールには、実行する必要のあるものを実行するためにページで呼び出すinit（）メソッドがあります（たとえば、イベントの配線、userIdなどの変数の設定）。

$(document).ready(function() {
   APP.init(<%= user.id %>);
   APP.homePage.init('abc');
});

したがって、ファイルが大きくなりすぎた場合は、それらを別々のファイルに分割することもできます。

  1. あるモジュールが別のモジュールを呼び出す必要がある場合、これが機能する唯一の方法は、パブリックAPIを介してこれを行うことだと思いますか？たとえば、homePageにuserIdが必要な場合、homePage＃initメソッドでそれを渡す必要がありますか？

  2. 私のコーディングスタイルはどうですか？ベストプラクティスとは見なされない明らかなスタイルはありますか？

  3. このアプローチについて何かコメントはありますか？一般的には良いですか？
4

2 に答える 2

3

あるモジュールが別のモジュールを呼び出す必要がある場合、これが機能する唯一の方法は、パブリック API を介してこれを行うことだと思いますか?

はい

たとえば、homePage に userId が必要な場合、それを homePage#init メソッドに渡す必要がありますか?

いいえ。すべてのモジュールでコードを繰り返すわけではありませんがuserId、デフォルト モジュールでパブリック ゲッターを提供します。

コーディングに関するコメント

このコード

var APP;
if(APP == undefined) {
  APP = {};
}

APP = ...

かなり役に立たない。とにかく上書きするので、ここでオブジェクトの存在を確認する必要はありません。これは、このコードを最初に実行する必要があることも意味します。モジュールをロード順序から独立させたい場合は、次のようなものを使用する必要があります

var APP = (function(a) {
    var private_vars; // ...
    a.init = ...
    a.publicMethod = ... // add them to the object instead of creating new one
    a.getPrivate = function() {
        return private_vars;
    };
    return a;
})(APP || {}); // create one iff not already existing

// other file:
var APP = APP || {};
APP.utils = ... // add object to namespace

コード

var _publicMethod = function($id){
    privateVar = id;
};

少し奇妙に見えます。まず、アンダースコアは通常、オブジェクトのセミプライベート (公開されているが使用されない) 属性を示しており、変数名には使用しないでください。関数は の「publicmethod」プロパティとして公開されるため、ここではそうではありませんAPP。必要に応じてアンダースコアを使用してください。次に、ここで関数式を使用する必要はありません。コードはモジュールのローカル スコープ内にあり、関数宣言を使用すると、そのスコープ内のどこでも使用できるようになり、関数に名前を付けることができます。使用する必要があります

function publicMethod($id) {
    privateVar = id;
}
a.publicMethod = publicMethod;
于 2012-06-26T23:52:54.500 に答える
1

私の意見では、モジュール パターンはコードを整理するための非常に優れた方法です。質問に答えるには:

1) はい、モジュールは、それらが返すオブジェクトで公開されている他のモジュールのメソッドとプロパティにのみアクセスできます。

2) あなたのコーディング スタイルはかなり良いと思います。これらの変更を行います：

APP = (function() {
    var _userId = -1;
    var _privateVar = '';

    var init = function($userId) {
       _userId = $userId;
    };
    var publicMethod = function($id){
        _privateVar = id;
    };
    return {
        init : init,
        publicMethod : _publicMethod
    };
})();

まず、アンダースコアは通常、「プライベート」プロパティまたはメソッドを表すことを意味します。第 2 に、返されるオブジェクトの余分な関数を削除して、関心のあるメソッドまたはプロパティを直接指定することができます。これは、パブリック メソッドでさえ、返されたオブジェクト内で定義されておらず、単に参照されているため、一般に「Revealing Module Pattern」と呼ばれます。

3) このアプローチは、コードをカプセル化する優れた方法であることは間違いありません。プライベート メソッドと特権メソッドの利点が得られ、公開する必要があるものだけを公開しているため、通常はより優れた API が得られます。

素晴らしい。

于 2012-06-26T23:28:07.557 に答える