一尘不染

是什么(function($){})(jQuery); 意思?

javascript

我刚刚开始编写jQuery插件。我写了三个小插件,但是我只是简单地将该行复制到我的所有插件中,而实际上并不知道这意味着什么。有人可以告诉我更多有关这些的信息吗?也许有一天写一个框架时会有用的解释:)

这是做什么的?(我知道它以某种方式扩展了jQuery,但是对此还有其他有趣的信息)

(function($) {

})(jQuery);

以下两种编写插件的方式有什么区别:

类型1:

(function($) {
    $.fn.jPluginName = {

        },

        $.fn.jPluginName.defaults = {

        }
})(jQuery);

类型2:

(function($) {
    $.jPluginName = {

        }
})(jQuery);

类型3:

(function($){

    //Attach this new method to jQuery
    $.fn.extend({

        var defaults = {  
        }

        var options =  $.extend(defaults, options);

        //This is where you write your plugin's name
        pluginname: function() {

            //Iterate over the current set of matched elements
            return this.each(function() {

                //code to be inserted here

            });
        }
    }); 
})(jQuery);

我可能离这里很远,也许所有的意思都一样。我很迷惑。在某些情况下, 似乎不适用于我使用Type 1编写的插件。到目前为止,Type
3对我来说似乎是最优雅的,但我也想了解其他类型。


阅读 374

收藏
2020-04-25

共1个答案

一尘不染

首先,看起来像的代码块(function(){})()仅仅是就地执行的功能。让我们分解一下。

1. (
2.    function(){}
3. )
4. ()

第2行是一个普通函数,用括号括起来,告诉运行时将函数返回到父范围,一旦返回,则使用第4行执行该函数,也许通读这些步骤会有所帮助

1. function(){ .. }
2. (1)
3. 2()

您可以看到1是声明,2是返回函数,3只是执行函数。

有关如何使用它的示例。

(function(doc){

   doc.location = '/';

})(document);//This is passed into the function above

至于关于插件的其他问题:

类型1:这实际上不是插件,而是作为函数传递的对象,因为插件往往是函数。

类型2:再次不是插件,因为它不会扩展$.fn对象。尽管结果是相同的,但这只是jQuery核心的扩展。这是如果您想添加遍历函数,例如toArray等。

类型3:这是添加插件的最佳方法,jQuery的扩展原型采用一个对象来保存您的插件名称和功能,并将其添加到您的插件库中。

2020-04-25