4

目的...

  1. グローバルオブジェクトから変数、オブジェクトなどを削除します。
  2. 衝突の可能性を取り除きます。

まず、Yahoo名前空間コードを実装します(たとえば、名前空間のルートとしてROOTを使用していることに注意してください)...

        if (typeof ROOT == "undefined" || !ROOT) {
                var ROOT = {};
        }

        ROOT.namespace = function () {
            var a = arguments,
                o = null,
                i, j, d;
            for (i = 0; i < a.length; i = i + 1) {
                d = ("" + a[i]).split(".");
                o = ROOT;
                for (j = (d[0] == "ROOT") ? 1 : 0; j < d.length; j = j + 1) {
                    o[d[j]] = o[d[j]] || {};
                    o = o[d[j]];
                }
            }
            return o;
        }

今、私は私の最初の名前空間を宣言します...

ROOT.namespace("UI");

            ROOT.UI = {
                utc: 12345,
                getUtc: function() {
                    return this.utc;
                }
            }

ここでやりたいのは、UIに必要な変数(この場合はUTCの現在の時刻)を保持して、それらがグローバルオブジェクト上にないようにすることです。また、いくつかの特定の機能を提供したいと思います。これは、あらゆる種類のインスタンス化なしですべてのページで利用可能である必要があります...

ここで、名前空間構造内にオブジェクトを格納したいと思います。ただし、このオブジェクトは複数回作成する必要があります。ここでの目的は、これを構造内に保持しながら、必要な回数だけ作成できるようにすることです。これは次のとおりです。

 ROOT.namespace("AirportFinder");
            ROOT.AirportFinder = function(){ 
                this.var1 = 99999;

                this.Display = function() {
                    alert(this.var1);
                }            
            }

そして、これはオブジェクトをインスタンス化するためのサンプルコードです...

        var test1 = new ROOT.AirportFinder();
        test1.Display();

これは良いパターンですか?

4

4 に答える 4

1

名前空間などで定義することは確かに合理的ROOTです。

クロージャを使用することもお勧めします

(function() {
    var AirportFinder = function() { 
        this.var1 = 99999;
        this.Display = function() {
            alert(this.var1);
        }            
    };

    // do Stuff with local AirportFinder here.

    // If neccesary hoist to global namespace
    ROOT.AirportFinder = AirportFinder;
}());

グローバルである必要がない場合。私自身$.foobar、グローバルデータを格納するためにエイリアスを使用しています(jQueryはとにかくグローバルであるため)。

関数が何をするのかはわかり.namespaceません。それは本当に必要ではありません。

私の個人的な好みは、常にクロージャを使用してプライベート名前空間を作成し、必要に応じてグローバル/共有名前空間に何かを持ち上げることです。これにより、グローバルな可視性/クラスターが最小限に抑えられます。

于 2011-03-08T10:32:08.243 に答える
0

あなたの質問の道から少し離れて、あなたを少し横に向けます:YUI3(http://developer.yahoo.com/yui/3/)を見てください-あなたは何も持っていません(持っている)そこのグローバル名前空間で、プライベートサンドボックスを取得します。素晴らしいコンセプトです。私はそのライブラリとその概念が大好きです(YUI3、古いYUI2については話していません)。それを行う方法はもちろん簡単で、あなたもそれを行うことができます:YUI3の動的モジュールローダーはモジュール(.jsファイル)をロードし、サンドボックス(単なるクロージャー)を作成し、コールバックを呼び出して、サンドボックスのハンドル。他のコードは、そのサンドボックスと自分の名前にアクセスできません。そのサンドボックス内で、さまざまなカプセル化パターンを使用し続けることができます(そしてそうすべきです)。このYUI3の概念は、特にマッシュアップがプログラマー自身によってGoogleマップやその他のよく知られたAPIを統合するのではなく、本質的により動的になる場合(たとえば、ユーザートリガー)に、外部コードを使用するマッシュアップに最適です。

于 2011-03-08T11:13:02.570 に答える
0

私は同じようなことをしようとしました:

var namespace = function(str, root) {
    var chunks = str.split('.');
    if(!root)
        root = window;
    var current = root;
    for(var i = 0; i < chunks.length; i++) {
        if (!current.hasOwnProperty(chunks[i]))
            current[chunks[i]] = {};
        current = current[chunks[i]];
    }
    return current;
};

// ----- USAGE ------

namespace('ivar.util.array');

ivar.util.array.foo = 'bar';
alert(ivar.util.array.foo);

namespace('string', ivar.util);

ivar.util.string.foo = 'baz';
alert(ivar.util.string.foo); 

試してみてください:http://jsfiddle.net/stamat/Kb5xY/

ブログ投稿:http ://stamat.wordpress.com/2013/04/12/javascript-elegant-namespace-declaration/

于 2013-04-12T13:15:14.607 に答える
0

匿名の自己実行関数を使用することにより、パブリックおよびプライベートの属性/メソッドを許可できます。

これは私が最も好きなパターンです:

(function ($, MyObject, undefined) {
  MyObject.publicFunction = function() {
      console.log("This is a public function!");
  };
  var privateFunction = function() {
    console.log("This is a private function!");
  };

  MyObject.sayStuff = function() {
    this.publicFunction();
    privateFunction();
    privateNumber++;
    console.log(privateNumber);
  };
  var privateNumber = 0;

  // You can even nest the namespaces
  MyObject.nestedNamespace = MyObject.nestedNamespace || {};      
  MyObject.nestedNamespace.logNestedMessage = function () {    
     console.log("Nested!!");
  };

}(jQuery, window.MyObject = window.MyObject || {}));

MyObject.sayStuff();
MyObject.nestedNamespace.logNestedMessage();
MyObject.publicFunction();

この記事のコメントからそれについて学びました。

于 2013-07-11T23:27:20.560 に答える