jQuerys $.each() 是如何工作的？

Question

也许标题不好，但这是我的问题： 我正在构建一个框架来了解有关 javascript 的更多信息。而且我想使用“”jQuery“”样式。

如何在 () 是可选的情况下创建一个函数？

$("p").fadeOut(); //() is there
$.each(arr, function(k, v) {...}); //Dropped the (), but HOW?

这是我想出的，但它不起作用：

$2DC = function(selector)
{
    return new function() {
        return {
            circle : function()
            {
                //...
            }
        }
    }
}


$2DC("#id1"); //Work
$2DC("#id2").circle(); //Work
$2DC.circle(); //DONT WORK

Answer 1

$ 实际上只是jQuery 函数的别名。您可以使用以下方法调用该函数：

jQuery("p"); 或 $("p");

但请记住，在 JavaScript 中，您可以将“东西”直接附加到函数中。

function foo(){
}
foo.blah = "hi";
foo.func = function() { alert("hi"); };

foo.func(); //alerts "hi"

这就是（概念上）jQuery 的each 函数的定义方式。

jQuery.each = function(someArr, callback) { ...

所以现在jQuery.each 是一个可以这样调用的函数：

jQuery.each([1, 2, 3], function(i, val) {
});

或更熟悉的

$.each([1, 2, 3], function(i, val) {
});

---

所以对于你的特殊情况，支持：

$2DC.circle(); 

您必须将circle 函数直接添加到$2DC：

$2DC.circle = function(){
   // code
};

Answer 2

函数是 JavaScript 中的对象。因此，它们可以用作变量，就像整数、字符串等一样。

在您的示例中，$2DC 是一个返回包含 circle 函数的对象的函数。

$2DC.circle(); 不起作用，因为 circle 只是返回对象的属性，而不是 $2DC 本身的属性。

对于$.each，这是因为$ 包含each 属性。你的$2DC 也可以做到这一点。像这样：

$2DC.circle = function(){
}

现在，$2DC.circle(); 可以工作了。因此，正如您所见，函数是对象，因此可以像其他对象一样具有属性。

Answer 3

$2DC.circle(); //DONT WORK

这不起作用，因为 $2DC 没有任何名称为 circle 的函数。它只是一个函数。

$2DC("#id2") 返回一个新函数，其中包含具有circle 函数的对象，所以$2DC("#id2").circle(); 对你来说很好。

如果你定义

$2DC.circle = function(){

};

你可以使用$2DC.circle();

Answer 4

创建您的基本函数，然后向该函数添加方法。

var f = function(text){
    alert(text);
}
f.fn1 = function(text){
    alert('fn:'+text);
}
f.fn2 = function(text){
    alert('fn2:'+text);
}

f('hi'); //hi;
f.fn1('hi'); //fn:hi;
f.fn2('hi'); //fn2:hi;

Answer 5

您引用的$.each 方法是$ 函数对象上的一个属性。

jQuery 中的$ 对象是一个函数对象，与 JavaScript 中的任何对象一样，您可以为该对象分配属性。

调用$ 函数对象充当构造函数并返回由jQuery.fn.init() 函数创建的新对象实例。将jQuery 的原型复制到jQuery.fn.init，以便新创建的对象实例可以访问jQuery 上定义的方法和插件。

Answer 6

可以使用类似的东西来实现。

$.fn.each = function (otherparams);

$.each = function (collection, otherparams) {
  return $.fn.each.apply(collection, arguments.slice(1));
};

将 each 添加为 fn 的属性（它只是 jQuery.prototype 的别名）意味着它可以作为每个 jQuery 集合的方法使用。第二段代码意味着它可以作为参数传入集合中。

一旦您习惯了apply（和call），它们就会成为 javascript 的一些最有用的功能。

Answer 7

试试这样：

$2DC = (function(selector)
{
    return new function() {
        return {
            circle : function()
            {
                //...
            }
        }
    }
})();

这样，$2DC 是函数返回的对象，而不是函数本身。