8

私は小さな CMS を jQuery AJAX プラグインとして作成していますが、決して長すぎるわけではありませんが (現在は約 500 行)、「サブクラス」ごとに 1 つずつ、個別のファイルに分割できると便利です。

(function($) {
    $.fn.myCMS = function() {
        this.classOne = function() {
        ...
        }
        this.classTwo = function() {
        ...
        }
    }
})(jQuery);

上記の例では、classOne のコードを 1 つのファイルに、classTwo を別のファイルに、myCMS の「baseclass」を 3 番目のファイルに配置したいと思います。(「サブクラス」ファイルのそれぞれで)このようなものでこれを達成することは可能ですか? 

$.extend(myCMS,classOne = function() {
...
})

どうもありがとう、

JS

4

2 に答える 2

6

プライベートスコープ/関心の分離を使用して「プラグイン」に追加したい。これは、すべてが 1 つのファイルに組み込まれるか複数のファイルに組み込まれるかに関係なく、プラグイン ベースの Web アプリケーションのメンテナンスと長期的な拡張性にとって重要です。

メソッドを直接アタッチするか、jQuery.fn.foo メソッドのプロトタイプに追加することで、プライベート スコープを作成し、既存の jQuery.fn メソッドを拡張できます。

(function ($) {

     // instance method attached to the constructor function
     $.fn.myCMS.classOne = function () {

     };

     // or "shared" method attached to prototype
     $.fn.myCMS.prototype.classOne = function() {

     };

})(jQuery);

jQuery.extend() を使用できます。これは、この場合、上記の最初のメソッドとしてコンストラクター インスタンスにメソッドを追加するための実際の "省略形" です。オブジェクトに追加するものは何でもカプセル化する必要があります (通常、これは匿名オブジェクトになります)。

$.extend($.fn.myCMS,{ classOne: function () { } });

設計の観点から、同じクロージャー変数を頻繁に取得する必要がある「クラス」がある場合、それらはおそらく同じ関数スコープ/クロージャーの一部である必要があります。または、それらのクロージャー変数のゲッターとセッターを公開する必要があります (おそらく _foo 規則を使用)これは、それらがコードでのみ使用されることを意図していることを示しています)。

(function ($) {

    var foo = "foo!";

    // combined getter/setter
    // could also check arguments.length
    $.fn.myCMS._foo = function (value) {
          if (typeof(value) != "undefined") {
               foo = value;
          } else {
               return foo;
          }
    };

)(jQuery);

ハッカーになりたくて、別のスコープからクロージャー変数を取得する必要がある場合は、他のスコープから .call() または .apply() を使用して、これらの新しいメソッドを独自のスコープで実行することで実現できると思います。これがどのように機能するかのサンプルを作成することはできますが、この種のシナリオでスコープ解決がどのように機能するかについて独自の調査を行うことをお勧めします。

with ($.fn.myCMS) { } 構造を使用して、元の「プラグイン」メソッドからスコープを「借りる」ことができると思いますが、私はそれについて 100% 肯定的ではありません。それについて。

于 2009-12-12T14:16:30.967 に答える
1

jQuery ui コードも参照すると役立ちます。たとえば、progressbar プラグインには、ui.core、ui.widget、および ui.progressbar の 3 つのファイルが必要です。jQuery UI ソース バンドルをダウンロードし、 demos ディレクトリの下にあるプログレスバーの例を見てください。(簡略化されたバージョンはどこにもホストされていませんでしたが、ソース バンドルには簡略化された例が含まれています)

于 2010-10-09T07:51:30.340 に答える