Question

有一些关于“标准”jQuery插件定义的东西，我似乎无法理解，似乎没有插件教程解释它。
我见过的大多数插件定义都是这样的：

(function($) {
    $.extend($.fn, {
        pluginName: function( options )
            ...
    });
})(jQuery);

现在，虽然我理解function($) { ... }部分的作用（确保jquery即使在noConflict模式下也能与$一起使用，创建一个“私有”方法等），我不明白为什么第一个字符是(，以)(jQuery)结尾。

是否需要使插件可链接？可以安全地忽略它吗？

修改

相同定义的变化：

;(function($) { // why is ; there?

Answer 1

它只是定义了一个匿名函数并立即调用它，你可以这样想：

var f = function($) { /* Code goes here, can use $ */ };
f(jQuery); // assings jQuery to $ parameter

现在，如果将这两个语句合并为一个，则得到：

(function($) { /* Code goes here */ })(jQuery);

这才是真的。以这种方式使用匿名函数执行此操作不会使用无用的变量名称污染全局范围，并且即使在noConflict模式下也允许使用$符号。

Answer 2

包装线与创建匿名函数然后调用它有关。 jQuery被传递，然后别名为$，这样你的插件仍然可以在jQuery noConflict模式下工作（$将不会被定义）。匿名函数是我们的插件获取本地范围所以我们不会意外地定义任何全局变量，因为它们是坏的。

作为jQuery插件开发人员的另一点我自己也不建议使用该代码开发插件： $ .extend（$。fn，{ pluginName：function（options） ... }）;

所有这一切只是为jQuery Object Prototype添加一系列函数，例如你可以调用$（'＃el'）。pluginName（）。如果您的插件非常简单，这很好，但是由于您的插件仍以过程方式而非面向对象的方式定义，因此维护起来非常困难。

更好的方法是这样的：

$.pluginName = {
    init: function(){
        var myPlugin = $.pluginName;

        // Attach jQuery Object Prototype (fn function)
        $.fn.pluginName = myPlugin.fn;

        // Attach DomReady
        $(function(){
            myPlugin.domReady();
        });
    }
    domReady: function(){},
    fn: function(){
        // your jQuery object function
    }
});

// Initialise our Plugin
$.pluginName.init();

这种方法还允许人们轻松扩展您的插件，如果它在某些区域不足或自行修复代码而不触及您的插件。例如，我可以通过执行以下操作覆盖您的fn函数： $ .pluginName.fn = fixedFnFunction（）;

这对社区发展很有帮助。我也喜欢它，因为它将jQuery Object Prototype中的内容保持在最低限度，从而降低了开销。

我正在寻找我用于参考的文章，并在准备好后发布。

Answer 3

construct（..）（jQuery）是用于在命名空间“jquery”中“插入”的闭包

jQuery插件定义

3 个答案: