骨幹：未捕獲類型錯誤：..不是構造函數

Question

我正在學習Backbone和JavaScript。我被困在一個錯誤，這個錯誤可能與純JavaScript而不是骨幹相關。

在經歷骨幹教程（不使用requireJS）的同時，我找到了下面的代碼行。

var FirstSubViewModel = Backbone.View.extend({ 
    render: function() { 
    var source = $("#vehicleTemplate").html(); 
    var template = _.template(source); 

    this.$el.html(template(this.model.toJSON())); 
    this.$el.attr("data-color", this.model.get("color")); 

    return this; 
}, 
    }); 

我們可以清楚地看到，代碼returns this。一切正常。

現在我試圖做同樣的在我自己的代碼庫（我用require.JS

我的看法型號：出現錯誤：不工作

define(['backbone'], function(Backbone) { 
    var FirstSubViewModel = Backbone.View.extend({ 
    template: _.template($('#myChart-template').html()), 
    render: function() { 
     $(this.el).html(this.template()); 
     var ctx = $(this.el).find('#lineChart')[0]; 
     return this; 
}, 
    initialize: function() { 
     this.render(); 
    } 
    }); 
}); 

我的控制器：

define(['backbone', 'FirstSubViewModel'], function(Backbone, FirstSubViewModel) 
{ var ch = new dashboardModel.chart({}); 
     new FirstSubViewModel({ 
       ^^ HERE I GET ERROR 
     el: '#chartAnchor1', 
      model: ch 
     }); 
}); 

我的看法型號：工作完全正常

define(['backbone'], function(Backbone) { 
     var FirstSubViewModel = Backbone.View.extend({ 
     template: _.template($('#myChart-template').html()), 
     render: function() { 
      $(this.el).html(this.template()); 
      var ctx = $(this.el).find('#lineChart')[0]; 
      // return this; Commented Out!** 
    }, 
     initialize: function() { 
      this.render(); 
     } 
     }); 
return FirstSubViewModel; 
    }); 

問題：如果我在底部使用return FirstSubViewModel而不是在渲染函數中返回this，那麼一切正常。但我想在render function中嘗試return this，並希望一切都能正常工作。最後我不想做return FirstSubViewModel。

FirstSubViewModel是不是構造

Answer 1

最後返回定義了將被包括在其他模塊在這種情況下是必需的：使用「返回此」在渲染功能時

錯誤。沒有這個模塊，返回undefined。

讓我們試着在控制檯：

x = undefined 
new x() 

TypeError: x is not a constructor

return FirstSubViewModel是強制性的。建議使用渲染功能中的return this。

代碼：

define(['backbone'], function (Backbone) { 
    var FirstSubViewModel = Backbone.View.extend({ 
     template: _.template($('#myChart-template').html()), 
     render: function() { 
      console.log("inside first sub view render"); 
      $(this.el).html(this.template()); 
      var ctx = $(this.el).find('#lineChart')[0]; 
      return this; 

     }, 
     initialize: function() { 
      this.render(); 
     } 
    }); 

    return FirstSubViewModel; // Works as expected. 
});