Question

This is a difficult one to explain, so I welcome comments querying the details. Basically with jQuery you can do the following things:

.

What I want

$.ajax().etc()
$("selector").doStuff().etc()

Which means that $ is acting as a function (that is then chainable) as well as an object (also chainable).

.

What I’ve got

I am writing some javascript myself and have successfully made a chainable set of functions like so:

myF.func1().func2()
myF('text') //Cannot get this working!

.

I’m using window.myF=(new myFuncs()) to get the first line working, but I can’t then use myF as a function. I’ve also made it so that myF can be used as a function, but then I can’t chain the other functions.

I’m extremely confused and as much as I’ve tried searching this site and Google, I must be searching the wrong thing as I have no idea where to go from here!

Questions in the comments are welcomed and expected!

.

My Setup (simplified)

(function(){
    var myFuncs=function(){

    };

    myFuncs.prototype = {
          foo: function() {
          }
          ,bar: function() {
          }
    }

    window.myF = (new myFuncs());
})();

Answer 1

I had a quick look at the jQuery source code and it looks like it doesn’t use prototypes for the jQuery object – the window.$.

Instead it uses $.extend:

var myF = function(){};
$.extend(myF, {
   actAsAnObject: function(){}
});

However, for what I’ll call the jQuery response object it does use prototypes. So if you call myF() this code gets run:

var myF = function(){
    return new myF.prototype.init(arguments); // based on the jQuery code
};

$.post is an object property, you can’t get it if you call the function itself. $().html is a jQuery response object function, it is not a member of the window.$object.

---

Answer to your update: http://jsfiddle.net/rmpW8/

(function(){
    var myFuncExternal = function(num){
        return new myFunc(num);           
    };
    var myFunc = function(num){
        this.num = num;
    };

    $.extend(myFuncExternal, {
        foo: function(num){
            console.log("In foo with: " + num);
        }
    })

    myFunc.prototype = {
          foo: function() {
              myFuncExternal.foo(this.num);
          },
          bar: function() {
              console.log("In bar with: " + this.num)
          }
    }

    window.myF = myFuncExternal;
})();