title: Namespacing in Backbone.js
body: <p>I am confused how I should implement namespacing in Backbone.js. I have been creating my Models, Collections &amp; Views globally. Is namespacing them simply adding a <code>App.</code> infront of the models, collections and views classes &amp; objects, and a line <code>window.App = {};</code>?</p>
  
  <p>It appears to work, but is this way considered a best practice? If not, what would be a better approach?</p>
  
  <p>I have also seen <code>App = App || {};</code> somewhere. What is the purpose of having <code>|| {}</code>?</p>
  
  <p><strong>Attempt at Namespacing</strong>
      // Namespace
      window.App = {};</p>
  
  <pre><code>// 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 });
  </code></pre>