Question

来自ready的{{3}}

以下所有三种语法都是等效的：


$（文件）。就绪（处理程序）

$（）。ready（处理程序）（不建议这样做）

$（处理程序）

做完作业后 - 阅读和玩jQuery API docs site，我不知道为什么

$().ready(handler)

建议不要

。第一种和第三种方式完全相同，第三种方法使用document在缓存的jQuery对象上调用ready函数：

rootjQuery = jQuery(document);
...
...

// HANDLE: $(function)
// Shortcut for document ready
} else if ( jQuery.isFunction( selector ) ) {
    return rootjQuery.ready( selector );
}

但ready函数与所选节点元素的选择器没有交互，ready源代码：

ready: function( fn ) {
    // Attach the listeners
    jQuery.bindReady();
        // Add the callback
    readyList.add( fn );
        return this;
},

如您所见，它只是将回调添加到内部队列（readyList），并且不会更改或使用集合中的元素。这使您可以在每个jQuery对象上调用ready函数。

像：

常规选择器：$('a').ready(handler) source code
无意义选择器：$('fdhjhjkdafdsjkjriohfjdnfj').ready(handler) DEMO
未定义选择器：$().ready(handler) DEMO

最后......对我的问题：为什么不推荐$().ready(handler)？

Answer 1

我得到了一位jQuery开发人员的正式回答：

$().ready(fn)仅有效，因为$()曾是$(document) _{的快捷方式（jQuery＆lt; 1.4）}
所以$().ready(fn)是一个可读的代码。

但人们习惯于做$().mouseover()之类的事情以及各种其他的疯狂行为并且人们必须$([])来获取一个空的jQuery对象

所以在1.4中我们更改了它，因此$()给出了一个空的jQuery，我们只是让$().ready(fn)工作，以免破坏大量代码

$().ready(fn)现在只是修补核心，以使其适用于遗留案例。

ready函数的最佳位置是$.ready(fn)，但这是一个非常古老的设计决策，这就是我们现在所拥有的。

我问他：

你认为$（fn）比$（）更易读（ready）（fn）？！

他的回答是：

我总是在实际的应用程序中执行$（document）.ready（fn），通常在应用程序中只有一个doc ready块，它不完全像维护一样。

我认为$（fn）也非常难以理解，它只是你必须知道的东西 ......

Answer 2

由于不同的选项与您指出的几乎完全相同，所以是时候加入库编写者的帽子并做出一些猜测。

也许jQuery人员希望$()可供将来使用（可疑，因为$().ready被记录起来工作，即使不推荐;它也会污染{{的语义1}}如果是特殊的）。
更实际的原因：第二个版本是不最终包装$的唯一版本，因此在维护代码时更容易破解。例如：
```
document
```
将此与
对比
```
// BEFORE
$(document).ready(foo);

// AFTER: works
$(document).ready(foo).on("click", "a", function() {});
```
与上述相关：// BEFORE $().ready(foo); // AFTER: breaks $().ready(foo).on("click", "a", function() {});是一个怪胎，因为它是（唯一的？）方法无论jQuery对象包裹什么都会起作用（即使它没有包装任何东西）就像这里的情况一样）。这是与其他jQuery方法的语义的主要区别，因此特别不鼓励依赖于此。

更新：正如Esailija的评论指出的那样，从工程角度来看，ready应该是一个静态方法，因为它的工作原理是这样的。

更新＃2：在源头挖掘，似乎在1.4分支ready中的某个点已更改为匹配$()，而在1.3中它表现得像$([])。这一改变将加强上述理由。

Answer 3

我想说的只是$()返回空对象这一事实，而$(document)则没有，因此您将ready()应用于不同的事物;它仍然有效，但我会说它不直观。

$(document).ready(function(){}).prop("title") // the title
$().ready(function(){}).prop("title")  //null - no backing document

Answer 4

这很可能只是一个文档错误，应该修复，使用$().ready(handler)的唯一缺点是它的可读性。当然，认为$(handler)同样难以理解。我同意，这就是我不使用它的原因。

你也可以说一种方法比另一种更快。但是，您经常在一个页面上连续多次调用此方法以注意差异吗？

最终归结为个人偏好。除了可读性参数之外，使用$().ready(handler)没有任何缺点。我认为在这种情况下文档是错误的。

Answer 5

只是为了明显显示三者中存在一些不一致，另外我添加了第四种常用形式：(function($) {}(jQuery));

使用此标记：

<div >one</div>
<div>two</div>
<div id='t'/>

和这段代码：

var howmanyEmpty = $().ready().find('*').length;
var howmanyHandler = $(function() {}).find('*').length;
var howmanyDoc = $(document).ready().find('*').length;
var howmanyPassed = (function($) { return $('*').length; }(jQuery));
var howmanyYuck = (function($) {}(jQuery));
var howmanyYuckType = (typeof howmanyYuck);

$(document).ready(function() {
    $('#t').text(howmanyEmpty + ":" + howmanyHandler + ":" 
        + howmanyDoc + ":" + howmanyPassed + ":" + howmanyYuckType);
});

最后一个语句的div显示结果为：0：9：9：9：undefined

所以，只有Handler和Doc版本与jQuery约定一致，当它们获得文档选择器时返回一些使用内容，并且使用Passed表单你必须返回一些内容（我不会这样做，我会想，但是它只是为了显示“内部”它有一些东西）。

以下是好奇的小提琴版：http://jsfiddle.net/az85G/

Answer 6

我认为这比其他任何东西都更符合可读性。

这个不那么富有表现力

$().ready(handler);

作为

$(document).ready(handler)

也许他们正试图推广某种形式的惯用jQuery。

为什么不推荐“$（）。ready（handler）”？

6 个答案: