Overview of Backbone.View

Question

People use Backbone.View many ways, and I'm a bit confused. I have seen:

 Backbone.View.extend({}); new Backbone.View.extend({}); new Backbone.View(); new Backbone.View; 

The first three are different. The last two are the same. (See here for the script.) What happens in each case?

Answer 1

It is the same.

When you extend a class with Backbone.View.extend({}) , as you can see, you are not adding any additional property or method to your class. You pass it an empty hash {} as an argument. So, Backbone.View and Backbone.View.extend({}) are pretty much the same.

About the presence of the new keyword before this, it just starts a new class. If you do not use the new keyword, you are just talking about classes, while with the new keyword you are talking about an object of this class itself.

Parentesis is not an obligation. This is only necessary if you want to pass arguments to your constructor, so new Backbone.View() and new Backbone.View; match, like new Backbone.View() and new Backbone.View.extend({}) , for the reasons I wrote earlier.

About this fiddle (http://jsfiddle.net/C2Z34/):

• myView1 is a class that extends the view
• myView2 (with a parent like in my fiddle) is an object of a class extended by Backbone.View
• myView3 is an object of the Backbone.View class. It is not expanded.
• myView4 the same as myView3

Answer 2

The extension creates a subclass. In your examples, you are not adding any custom code, so viewclasses behave exactly like the original views. Using the new keyword, you call the constructor function of your class, which returns an instance of the view. Therefore, if you want custom code to look, for example. with the rendering function you expand the view of BB. Then, when you want to use this view, you create a new instance of the extended view.