How to turn jQuery/Javascript functions into methods

Question

Could anyone explain how to turn functions into methods and the variables into parameters of an object in jQuery/Javascript?

And even more interesting Why i should do that?

Answer 1

There is (among others) the closure trick:

function obj(x, y) {
    var z = 0;

    return {
        foo: function() { z += x; return z; },
        bar: function() { z *= y; return z; }
    };
}

o = obj(2, 3);
o.foo();

This particular approach has the advantage that it hides internal state reasonably well. It is not easy (maybe impossible, but I'm not sure) to inadvertently tinker with z directly from outside the "object".

Answer 2

in jQuery:

var MyClass = function( x, y ) {
  this.x = x;
  this.y = y;
};
$.extend(MyClass.prototype, {
  foo: function(z) { ... },
  bar: function() { ... }
});

than you could:

var myObject = new MyClass(1, 2);

or with HJS plugin:

var MyClass = $.Class.create({
  initialize: function(x, y) {
    this.x = x;
    this.y = y;
  }.
  foo: function(z) { ... },
  bar: function() { ... }
});