编写“单元可测试”的jQuery代码？

Question

直到现在我还习惯在ready（）函数中编写我的所有代码，如：

$(document).ready(function() {
  // all my code
});

现在我看到使用这种方法，我的代码不是“单元可测试的”，例如我无法从QUnit 访问ready（）内的内容。

构造与使用ready（）函数兼容且能够进行测试的jQuery代码的正确方法是什么？

是否有良好的开源代码库或项目可供学习和学习？

Answer 1

让你的代码在ready处理程序中只调用就绪处理程序之外的函数：

$(document).ready(function() {
  // call some functions outside of handler
});

// most of my code

这样，您也可以调用这些函数进行单元测试。

---

注意，$(document).ready有一个捷径：

$(function() {
  // call some functions outside of handler
});

// most of my code

Answer 2

我看到两种方法。

1. 将QUnit代码放在文档中，准备好在您自己的代码之后运行。

2. 将代码放入模块中。

选项＃2如下所示：

var MyModule = (function() {
    // Your code
}());

$(document).ready(function() {
    // Quit tests, referring to MyModule.xxx
});

在选项＃2中，您无法访问模块中的私有元素。

Ben Cherry不久前在http://www.adequatelygood.com/2010/7/Writing-Testable-JavaScript谈到了这个问题，他实际上对基于闭包的隐私提出了一个有争议的评论，因为它对单元测试有影响。

Answer 3

最有效的方法之一是使用JS“namespaces”构建编码，实际上你可以从jQuery core得到一个很好的例子。