3

Backbone.jsで名前空間を実装する方法がわかりません。モデル、コレクション、ビューをグローバルに作成しています。それらの名前空間App.は、モデル、コレクション、ビューのクラスとオブジェクト、および行の前に追加するだけwindow.App = {};ですか?

動作しているように見えますが、この方法はベストプラクティスと見なされますか?そうでない場合、より良いアプローチは何でしょうか?

私もApp = App || {};どこかで見ました。持つ目的は何|| {}ですか?

名前空間の試行 //名前空間window.App={};

// Models
App.Product = Backbone.Model.extend();

// Collections
App.ProductCollection = Backbone.Collection.extend({
    model: App.Product,
    url: '/wizard'
});

// Views
App.ProductListView = Backbone.View.extend({
    el: '#photo_list',

    initialize: function() {
        this.collection.bind('reset', this.render, this);
    },

    render: function() {
        this.collection.each(function(product, index){
            $(this.el).append(new App.ProductView({ model: product }).render().el);
        }, this);
        return this;
    }
});

// Snippet

App.productList = new App.ProductCollection();
App.selectedProductList = new App.SelectedProductCollection();
App.productListView = new App.ProductListView({ collection: App.productList });
4

3 に答える 3

4

名前空間オブジェクトを作成または更新する名前空間関数を使用することをお勧めしますns('App.Views.Homepage', Backbone.View.extend({...})

再。名前空間の規則-自分の都合に合わせて、ファイルシステム構造を使用できます。たとえば、UI/Homepage/View/Main.jsになりApp.UI.Homepage.View.Mainます(これはモジュールを使用する場合です)。

または、別の簡単な作成方法は、関連するファイルを簡単に見つけることです-機能に基づいて構造を作成します。たとえばApp.Backbone.Collection.Comments、より一般的なものからより具体的なものに移行します。たとえば、1つのアプリ、1つのバックボーンがあり、ビュー、モデル、コレクションがあります。 、ルーター。そして、それぞれの中には、ユースケースに固有の複数のモジュールがあります。

例として、これが私が使用する名前空間関数です:

var ns = window.ns = function (nspace, payload, context) {
  payload = payload || {};

  context = context || window;

  var parts = nspace.split('.'),
    parent = context,
    currentPart = '';

  while (currentPart = parts.shift()) {
    if (parts.length !== 0) {
      parent[currentPart] = parent[currentPart] || {};
    }
    else {
      parent[currentPart] = parent[currentPart] || payload;
    }
    parent = parent[currentPart];
  }

  return parent;

使用方法は上記の通りです。

于 2012-09-03T06:45:42.530 に答える
1
  1. JSで名前空間を使用することがベストプラクティスであると考えられているので、これを続けてください。
  2. 言われているように、「手動」の名前空間の代わりにヘルパー関数を使用する方がよい場合は。ここにある場合、私が使用する名前空間関数。
  3. App = App || {};-次のことを行います。アプリが未定義の場合(初期化されていない、初めて使用される)|| 演算子はfalseそのように返し、2番目のステートメントが適用され、App変数は空のオブジェクトで初期化されます。
于 2012-09-03T08:17:59.167 に答える
1

JavaScriptは名前空間をサポートしていません。あなたのアプローチは、グローバルなAppオブジェクト内にバックボーンオブジェクトをネストすることを意味します。これは、JavaScriptの名前空間に近づくのとほぼ同じです。イニシャライザ構文に関するahrenのコメントを参照してください。

于 2012-09-03T05:54:44.807 に答える