backbone.js basic questions

Question

(function($){
  var ListView = Backbone.View.extend({    
    el: $('body'),

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

    render: function(){
      $(this.el).append("<ul> <li>Hello Yupeee</li> </ul>");
    }
  });

  var listView = new ListView();      
})(jQuery);

1. Why do we pass jQuery as argument.
2. what does el: $('body') mean?
3. what does _.bindAll(this, 'render'); do?
4. Let's suppose i need another element, lets take Text Field or something... how would i go with it... should i add all in render function...
5. Should i know JQuery before i go with backbone.js

Answer 1

1. We are scoping jQuery object to $ inside the self executing anonymous function. So that inside the function there are no conflicts with other libraries that might be using $ variable.
2. In backbone, views bind themselves to an html dom element. If it is not specified it is empty 'div'. So in this case it is referring to body.
3. It will make sure that the calls to the render method are called in correct context 'this', which you want to be current view object.
4. Usually you create a template, by using underscore templating engine or anyone by your choice. You can also create html elements as string also, backbone doesn't really care in any case. Then you bind it to the view as the el. By either compiling the template or straight up html.
5. You should know javascript well enough, event bindings in general and jQuery selectors at minimum. Although backbone says you don't need jQuery, but it is definitely good to know.

Answer 2

1. What is doing this syntax is something like $ = jQuery before start executing the block.
2. It is gonna initialize this.el pointing to the DOM element body.
3. It will modify the calls to the render method so the (render.context).this will be always the actual this. Check Underscore's bindAll documentation. This sounds weird but in JS the context if very volatile :)
4. Yes, but templates can be helpful.
5. It helps, also Underscore.