javascript - jQuery/$ 为何既是函数又是 'prototype root'

Question

这是一个很难解释的问题，所以欢迎评论询问细节。基本上使用 jQuery 你可以做以下事情:

.

我想要什么

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

这意味着 $ 充当函数(可链接)以及对象(也可链接)。

.

我有什么

我自己编写了一些 JavaScript，并成功地制作了一组可链接的函数，如下所示:

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

.

我正在使用 window.myF=(new myFuncs()) 来使第一行正常工作，但我无法将 myF 用作函数。我还做到了 myF 可以用作函数，但我无法链接其他函数。

我非常困惑，尽管我尝试在这个网站和 Google 上进行搜索，但我一定是搜索到了错误的内容，因为我不知道从这里该去哪里!

欢迎并期待评论中的问题!

.

我的设置(简化)

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

    };

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

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

Answer 1

我快速浏览了 jQuery 源代码，看起来它没有使用 jQuery 对象的原型(prototype) - window.$。

相反，它使用$.extend:

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

但是，对于我所说的 jQuery 响应对象，它确实使用原型(prototype)。因此，如果您调用 myF() 则会运行此代码:

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

$.post 是一个对象属性，如果你调用函数本身，你无法获取它。 $().html 是一个 jQuery 响应对象函数，它不是 window.$ 对象的成员。

<小时/>

回复您的更新: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;
})();