JQuery JavaScript设计：自动执行函数还是对象文本？

我很好奇，在构造封装的代码块时，是否有与JQuery相关的最佳实践

通常，在构造页面时，我喜欢将页面中使用的函数封装在对象中。这允许我在构建应用程序时进行一些封装。没有什么比看到一个JavaScript文件中有这么多内容更让我讨厌的了

function doSomethingOnlyRelevantOnThisPage() {
    // do some stuff
}

我认为这会造成混乱的设计，并不能很好地封装功能

通常在许多框架中，有一个标准用于执行这种封装

在Mootools中，他们喜欢对象文字符号：

var Site = {        
    // properties and methods
}

在YUI中，他们支持自执行函数表示法：

(function() { // properties and methods })()

第二个示例的好处是创建了一个闭包，从而允许您定义私有属性和方法

---

我的问题是：对于创建这些干净封装的结构，任何JQuery爱好者都有什么最佳实践吗？使用它们的基本原理是什么？

我通常遵循原型模式：

MyFunction = function(param1, param2)
{
   this.property1 = param1;
   // etc.
}

MyFunction.prototype =
{
    memberOne: function(param1)
    {
       // ...
    },

    memberTwo: function(param2)
    {
    }
}

你得到一个“构造函数”（函数本身）和封装的“方法”和“字段”

---

对于习惯于基于类的OO语言的人来说更容易：）

我在开发时使用YUI和jQuery（YUI小部件和一些方便的函数、jQuery选择器和javascript“扩展”），我使用的通用javascript模板如下：

/*global YAHOO, $ */

// Create the public-scope accessable namespace for this page
YAHOO.namespace('Project');

YAHOO.Project.page = function() {
    // Private members

    var self = {};

    // Public members
    var pub = {};

    pub.init = function() {

    };

    return pub;
} ();

// When the DOM is loaded, initialize this module
$(document).ready(YAHOO.Project.page.init);

现在很明显，如果不想使用YUI，可以删除YAHOO.namespace（）调用，但这是基本的大纲。它使用对象文字符号，但也允许您定义私有属性和方法

---

请记住，在调用私有成员或引用私有变量时，将它们引用为

self.funcName（）

。您可以在

self

对象之外定义它们，但是对象中的任何地方都会出现不匹配，您试图确定

size\u of（）

是私有方法还是在其他地方全局定义的。

因为我已经使用jQuery一段时间了，我已经决定了一个适合我的标准模式

它是YUI模块模式与jQuery插件模式的组合。。我们最终使用了自动执行闭包模式。这在以下几个方面是有益的：

它将代码保持在最低限度

它强化了行为与表现的分离

它提供了防止命名冲突的闭包

这就是它看起来的样子：

;(function($) {        
    var myPrivateFunction = function() {
    };

    var init = function() {
        myPrivateFunction();
    };

    $(init);
})(jQuery);

我们意识到，分配函数执行的结果（类似于YUI模块模式）会公开可能从表示代码中调用的代码。我们想防止这种情况，所以这种模式适合

当然，我们可以内联编写init方法，而无需为函数定义变量。我们一致认为，显式定义init函数可以使代码对读者更清晰

如果我们想在页面/外部js文件之间共享函数，会发生什么？我们只需挂接jQuery为扩展jQuery对象本身而提供的现有机制，即extend函数

如果函数是静态的，我们使用$.extend，如果它们在包装集上运行，我们使用$.fn.extend函数

---

希望这对其他人有所帮助。

但这只有在您计划在对象中封装状态时才有用。您必须在这些对象上调用new来创建实例。在我的例子中，它们的行为在OO术语中更像一个静态类。真的，真的。。。在本例中，我更喜欢自动执行的匿名函数。我一直看到这种模式，但我渴望得到一个更完整的示例-我有一个页面，其中包含一些不同的、相当复杂的交互元素，这些元素的逻辑应该彼此分开封装。在这种情况下组织代码有什么建议吗？为每个不同的UI部件使用$.fn.extend似乎有悖常理。我绝对不会提倡使用扩展jquery函数，除非你正在编写一个插件，这样可以在许多页面中重复使用。在您的情况下，我会将我的功能分解为不同的部分，创建一个自动执行的函数，将该逻辑包含在它自己的闭包中。然后，任何共享代码都可以通过$.extend附加到jQuery本身，这将允许您拥有不需要元素上下文即可运行的帮助函数。关于立即调用函数表达式（IIFE）的非常好的文章