How does jQuerys $.each() work?
也许标题不好,但这是我的问题:
我正在构建一个框架来了解有关 javascript 的更多信息。我想使用”jQuery”风格。
如何创建一个 () 是可选的函数?
1
2 |
$(“p”).fadeOut(); //() is there
$.each(arr, function(k, v) {…}); //Dropped the (), but HOW? |
这是我想出的,但它不起作用:
1
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
$2DC = function(selector)
{ return new function() { return { circle : function() { //… } } } }
$2DC(“#id1”); //Work |
- 你的标题令人困惑。我认为 $.() 甚至不是有效的 JavaScript。
- 重复的 “jQuery” var 是一个函数还是一个对象?
- 我想学jQuery,那我觉得最好看一下源码:github.com/jquery/jquery
$ 实际上只是 jQuery 函数的别名。您可以使用以下命令调用该函数:
jQuery(“p”); 或 $(“p”);
但请记住,在 JavaScript 中,您可以将”东西”直接附加到函数中。
1
2 3 4 5 6 |
function foo(){
} foo.blah =“hi”; foo.func = function() { alert(“hi”); }; foo.func(); //alerts”hi” |
这就是(概念上)jQuery 的 each 函数的定义方式。
1
|
jQuery.each = function(someArr, callback) { …
|
所以现在 jQuery.each 是一个可以这样调用的函数:
1
2 |
jQuery.each([1, 2, 3], function(i, val) {
}); |
或更熟悉的
1
2 |
$.each([1, 2, 3], function(i, val) {
}); |
所以对于你的特殊情况,支持:
1
|
$2DC.circle();
|
您必须将 circle 函数直接添加到 $2DC:
1
2 3 |
$2DC.circle = function(){
// code }; |
- 谢谢! :) 那真的很容易……我通过构建一个框架学到了很多东西。
- @Sawny – 当然可以。 JavaScript 很有趣
函数是 JavaScript 中的对象。因此,它们可以用作变量,就像整数、字符串等一样。
在您的示例中,$2DC 是一个返回包含 circle 函数的对象的函数。
$2DC.circle(); 不起作用,因为 circle 只是返回对象的属性,而不是 $2DC 本身的属性。
在 $.each 的情况下,这是因为 $ 包含 each 属性。您的 $2DC 也可以做到这一点。像这样:
1
2 |
$2DC.circle = function(){
} |
现在,$2DC.circle(); 可以工作了。因此,正如您所见,函数是对象,因此可以像其他对象一样具有属性。
- 1,即使你以 4 秒的优势击败了我 :-)
- @AdamRackis:我是回答忍者^_^
1
|
$2DC.circle(); //DONT WORK
|
这不起作用,因为 $2DC 没有任何名称为 circle 的函数。它只是一个函数。
其中 $2DC(“#id2”) 返回一个包含具有 circle 函数的对象的新函数,因此 $2DC(“#id2”).circle(); 对您来说很好。
如果你定义
1
2 3 |
$2DC.circle = function(){
}; |
你可以使用 $2DC.circle();
可以使用类似这样的方法来实现。
1
2 3 4 5 |
$.fn.each = function (otherparams);
$.each = function (collection, otherparams) { |
将 each 添加为 fn 的属性(它只是 jQuery.prototype 的别名)意味着它可以作为每个 jQuery 集合的方法使用。第二段代码意味着它可以作为参数传入集合中。
应用(和调用)是 javascript 的一些最有用的特性,一旦你习惯了它们。
创建你的基础函数,然后给函数添加方法。
1
2 3 4 5 6 7 8 9 10 11 12 13 |
var f = function(text){
alert(text); } f.fn1 = function(text){ alert(‘fn:’+text); } f.fn2 = function(text){ alert(‘fn2:’+text); } f(‘hi’); //hi; |
你所指的$.each方法是$函数对象的一个??属性。
jQuery 中的 $ 对象是一个函数对象,与 JavaScript 中的任何对象一样,您可以为该对象分配属性。
调用 $ 函数对象充当构造函数并返回由 jQuery.fn.init() 函数创建的新对象实例。 jQuery 的原型被复制到 jQuery.fn.init 以便新创建的对象实例可以访问在 jQuery.
上定义的方法和插件
试试这样:
1
2 3 4 5 6 7 8 9 10 11 |
$2DC = (function(selector)
{ return new function() { return { circle : function() { //… } } } })(); |
这样,$2DC 是函数返回的对象,而不是函数本身。
- 对于投票给我的人,你一定是个真正的天才:jsfiddle.net/andrepadez/Pdvju
- 在这种情况下 $2DC 不再是一个函数,它只是一个普通的对象。 $2DC(“#id1”); 不再有效。这不是 OP 想要的。因此,我对您投了反对票,并且因为您没有在答案中解释代码。
- 它是一个返回函数的对象,就像 jQuery 一样!然后试试小提琴
- jQuery 是一个函数(它是一个对象)。它可以这样调用:jQuery(p)。在您的回答中, $2DC 只是一个普通对象(不是函数),因此 $2DC(p) 不起作用。
- var jQuery = (function() { … })( 窗口 );这是 jQuery 的源代码,还想再争论一下吗?
- 是的,我愿意。检查最后一行:return jQuery。这指的是一个函数(它也恰好被命名为 jQuery)。所以 jQuery 是一个函数,而不仅仅是一个普通的对象。在您的示例中,您返回的是一个对象 new function()。 jQuery 正在返回 function 这是一个函数。由于 jQuery 是一个函数 $(p) 有效。在您的情况下, $2DC(p) 不能作为普通对象工作,而不是函数。
- 哦,是的……我忘了包括那个细节。我很抱歉
来源:https://www.codenong.com/9006898/