Four questions about nettuts "30 days to learn jquery"

Viewed 1009

I'm doing a free jQuery course on nettuts called 30 days to learn jquery by Jeffrey Way and I have four things I'm really stumped about, first off here's the code:

(function() {
    $('html').addClass('js');

    var contactForm = {
            container: $('#contact'),

        init: function() {
            $('<button></button>', {
                text: 'Contact Me'
            })
                .insertAfter('article:first-child   ')
                .on('click', this.show);
            },
        show: function() {
            contactForm.container.slideDown(500);
        }                       
    };

    contactForm.init(); 

})();

It basically slides down a contact form when you click the "contact Me" button on the website. My questions are:

  1. Whats the whole point of "init" and do you need it?
  2. why is the whole jquery code inside of a variable?
  3. on the string of code that says .on('click', this.show); why do you need this in this.show?
  4. finally, why do you need contactForm.container.slideDown(500); as in why can't you just say container.slideDown(500); or $('form.contact').slideDown(500); (by the way the id of the form that slides down is contact.
1 Answers
Related