title: Backbone View function throws TypeError: object is not a function
body: <p>I have a Backbone view (below), and I am creating a new nested child view, just like the other views in the render function, but I get a new error <code>Uncaught TypeError: object is not a function</code>.  I am unsure of why it is complaining, because it is a function with paramaters.   I get the error even without passing in parameters, and it points to the call to the new <code>DeleteInstrumentView</code> as noted below.  I am having trouble debugging this as I am also not quite sure of the error, and dont believe it to be syntax related.</p>
  
  <p><a href="http://jsfiddle.net/chrisfrisina/wcxX8/" rel="nofollow">Here</a> is the full code if for some reason you are interested.</p>
  
  <pre><code>define([
    … require paths …
  ], function( … matching require names …){
    return Backbone.View.extend({
      el: $('.component'),
      events : {
        … event handlers …
      },
  
      initialize: function(options){
        if (options) {
          … make from passed in params
        } else {
          … make from scratch
        }
  
        … dispatch handlers …
  
        this.render();
      },
  
      /*
        This View does not have its own html rendering, but instead creates
        a new children which render themselves.
      */
      render: function(options){
        if(options) {
          new MeasuresView({
            … params …
          });
        }
        else {
          new MeasuresView({
            … params …
          });
  
          new InstrumentDropDownView({
            … same params …
          });
  
          // I have verified that the params are working here, regardless that they are also present in the previous nested views
          console.warn(this.component.get('measures'));
          console.warn(this.component);
          console.warn('#delete-component-'+this.component.cid);
          console.warn(this.component.cid);
  
          new DeleteInstrumentView({
            collection: this.component.get('measures'),
            parent: this.component,
            el: '#delete-component-'+this.component.cid,
            parentCID: this.component.cid
            //  The browser throws the error and points here //
          });
  
        }
        return this;
      },
  
      … other functions …
  
    });
  });
  </code></pre>
  
  <p>and here is the DeleteInstrumentView.js file :</p>
  
  <pre><code>define([
    'jquery',
    'underscore',
    'backbone',
    'app/dispatch',
    'app/log',
    'text!backbone/templates/button/deleteInstrument.html'
  ], function($, _, Backbone, dispatch, log, deleteInstrumentTemplate){
    var DeleteInstrumentView = Backbone.View.extend({
      events : {
        'click' : 'deleteInstrument'
      },
  
      initialize: function(options) {
        if (options) {
          console.warn(options);
          this.collection = options.collection;
          this.parent = options.parent;
          this.el = options.el;
          this.parentCID = options.parentCID;
        }
        this.render();
      },
  
      render: function() {
        var compiledTemplate = _.template( deleteInstrumentTemplate);
        $(this.el).append( compiledTemplate );
        return this;
      },
  
      deleteInstrument: function(instrument) {
        console.log('DELETE clicked');
      }
    });
    return new DeleteInstrumentView();
  });
  </code></pre>
  
  <p>Full error Trace:</p>
  
  <pre><code>Uncaught TypeError: object is not a function componentView.js:112
  Backbone.View.extend.render componentView.js:112
  Backbone.View.extend.initialize componentView.js:68
  Backbone.View backbone.js:1236
  child backbone.js:1467
  (anonymous function) componentsView.js:220
  _.each._.forEach underscore.js:78
  Backbone.View.extend.render componentsView.js:211
  Backbone.Router.extend.newSong router.js:48
  (anonymous function) backbone.js:967
  (anonymous function) backbone.js:1164
  _.some._.any underscore.js:207
  _.extend.loadUrl backbone.js:1162
  _.extend.start backbone.js:1128
  initialize router.js:146
  initialize SOF.js:17
  (anonymous function) application.js:33
  context.execCb require.js:1598
  Module.check require.js:846
  (anonymous function) require.js:1084
  (anonymous function) require.js:131
  (anonymous function) require.js:1127
  each require.js:59
  Module.emit require.js:1126
  Module.check require.js:900
  (anonymous function) require.js:1084
  (anonymous function) require.js:131
  (anonymous function) require.js:1127
  each require.js:59
  Module.emit require.js:1126
  Module.check require.js:900
  (anonymous function) require.js:1084
  (anonymous function) require.js:131
  (anonymous function) require.js:1127
  each require.js:59
  Module.emit require.js:1126
  Module.check require.js:900
  (anonymous function) require.js:1084
  (anonymous function) require.js:131
  (anonymous function) require.js:1127
  each require.js:59
  Module.emit require.js:1126
  Module.check require.js:900
  (anonymous function) require.js:1084
  (anonymous function) require.js:131
  (anonymous function) require.js:1127
  each require.js:59
  Module.emit require.js:1126
  Module.check require.js:900
  (anonymous function) require.js:1084
  (anonymous function) require.js:131
  (anonymous function) require.js:1127
  each require.js:59
  Module.emit require.js:1126
  Module.check require.js:900
  (anonymous function) require.js:1084
  (anonymous function) require.js:131
  (anonymous function) require.js:1127
  each require.js:59
  Module.emit require.js:1126
  Module.check require.js:900
  (anonymous function) require.js:1084
  (anonymous function) require.js:131
  (anonymous function) require.js:1127
  each require.js:59
  Module.emit require.js:1126
  Module.check require.js:900
  Module.enable require.js:1114
  Module.init require.js:759
  (anonymous function) require.js:966
  (anonymous function) require.js:131
  text.finishLoad text.js:155
  (anonymous function) text.js:185
  xhr.onreadystatechange text.js:287
  </code></pre>