Question

I am very new for understanding the javascript object oriented development. So I am reading jQuery source code and trying to understand by implementing the same concept to my custom libs although goal is not copy code but creating handful of function in OOP way.Here is my code..

(function (window) {
var myCustomClass = function () {
    debugger;
    return new myCustomClass.mycustomFunction.Init();
};
myCustomClass.mycustomFunction= myCustomClass.prototype = {
    Init: function () {
        return this;
    },
    alert: function () {
        alert('I got called');
    }
};
window.$ = window.mQuery = myCustomClass;
})(window);

and trying to use in this way:

  mQuery().alert();

but it is giving an error , I am trying to figure it but with no avail. I think , I am missing some concept ,please direct me on the right direction.

Answer 1

Looking at the jQuery source code and trying to mimic it’s concept is not necessarily a great way to start your javascript OOP learning curve. I would suggest you start with something simpler and some basic books, and work your way up before trying to understand a fairly complex library from it’s source code.

If you are looking for a way to chain functions from a constructor “jQuery style“, you can try this simple pattern as a starter:

var myCustomClass = function() {
    // initialize a new instance
    if(!(this instanceof myCustomClass)) {
        return new myCustomClass();
    }
};
myCustomClass.prototype = {
    constructor: myCustomClass,
    // add some custom methods
    alert: function() {
        window.alert.apply(window, arguments);
        return this;
    },
    write: function(str) {
        document.body.innerHTML = str;
        return this;
    }
};

myCustomClass().alert('foo').write('bar');

​